详解vue项目打包后通过百度的BAE发布到网上的流程


Posted in Javascript onMarch 05, 2018

经过两天的研究终于将VUE打包后的项目通过BAE发布到了网上。虽然接口方面还有一下问题但是自己还是很高兴的。

首先说一下这个项目需要用到的技术,vue+express+git+百度的应用引擎BAE。

继续编辑终于将自己写的JSON文件模拟的数据也传上去了。

具体的步骤:

1,首先讲写好的vue项目打包(具体的打包过程我就不在说了,直接npm run build,就会在VUE项目文件中重新创建一个dist文件,这个就是打包好的项目)

详解vue项目打包后通过百度的BAE发布到网上的流程 

2,在百度的应用引擎BAE部署一个项目,一天才2毛钱很便宜。自己玩很划算。

详细的的步骤在https://cloud.baidu.com/doc/BAE/QuickGuide.html上面都有介绍,我用的GIT版本管理工具。一定要选择nodejs0.10.21-web这个类型。因为我们用的express框架。根据步骤创建好自己的库以后。先自己熟悉一下他的配置文档。

3,在自己创建的库里面将espress安装上去,具体的步骤自己度娘。(npm install -g express-generator 这个命令一定要有,要不然可能提示express命令找不到)

接下来就是重头戏了,虽然很简单,但是我研究了半天。

(1)先将git管理的这个文件里三个文件,除了app.conf全部删掉,然后将创建的express项目中的文件复制出来放到git 管理的那个库里面,git管理的库的文件名基本上是test1\appid245yn4jb32这个样子的。test1是我创建的文件夹,appid245yn4jb32这个文件夹是git远程克隆下来的。将express创建的项目中的文件,包括依赖全部复制到appid245yn4jb32文件夹下面。同时将bin文件夹里面的www文件加上js后缀。因为这个BAE只识别.js的入口文件。同时将www文件中的端口改为18080.   因为BAE的默认端口为18080。

详解vue项目打包后通过百度的BAE发布到网上的流程详解vue项目打包后通过百度的BAE发布到网上的流程

(2)将vue项目中打包好的项目(dist文件夹下面的所有文件)复制到public文件夹下面,将它原来的删掉。

这样将所有文件上传 ,打开网站,应该就可以看到vue项目中的东西了。(不过是没有数据的样子)

总结

以上所述是小编给大家介绍的详解vue项目打包后通过百度的BAE发布到网上的流程,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
IE6与IE7中,innerHTML获取param的区别
Mar 15 Javascript
Extjs学习笔记之五 一个小细节renderTo和applyTo的区别
Jan 07 Javascript
jquery使用hide方法隐藏指定id的元素
Mar 30 Javascript
jquery实现的缩略图预览滑块实例
Jun 25 Javascript
JavaScript仿静态分页实现方法
Aug 04 Javascript
通过javascript进行UTF-8编码的实现方法
Jun 27 Javascript
jQuery模拟Marquee实现无缝滚动效果完整实例
Sep 29 Javascript
webpack实现热更新(实施同步刷新)
Jul 28 Javascript
小程序tab页无法传递参数的方法
Aug 03 Javascript
JavaScript刷新页面的几种方法总结
Mar 28 Javascript
node.js express框架简介与实现
Jul 23 Javascript
jquery.validate自定义验证用法实例分析【成功提示与择要提示】
Jun 06 jQuery
Angular利用内容投射向组件输入ngForOf模板的方法
Mar 05 #Javascript
axios全局请求参数设置,请求及返回拦截器的方法
Mar 05 #Javascript
axios拦截设置和错误处理方法
Mar 05 #Javascript
完美解决axios在ie下的兼容性问题
Mar 05 #Javascript
vue.js 使用axios实现下载功能的示例
Mar 05 #Javascript
Vue 中使用vue2-highcharts实现top功能的示例
Mar 05 #Javascript
Vue 中使用vue2-highcharts实现曲线数据展示的方法
Mar 05 #Javascript
You might like
PHP排序之二维数组的按照字母排序实现代码
2011/08/13 PHP
PHP将整个网站生成HTML纯静态网页的方法总结
2012/02/05 PHP
php数组中删除元素之重新索引的方法
2014/09/16 PHP
Thinkphp模板标签if和eq的区别和比较实例分析
2015/07/01 PHP
laravel admin实现分类树/模型树的示例代码
2020/06/10 PHP
8款非常棒的响应式jQuery 幻灯片插件推荐
2012/02/02 Javascript
setTimeout的延时为0时多个浏览器的区别
2012/05/23 Javascript
JS批量操作CSS属性详细解析
2013/12/16 Javascript
控制文字内容的显示与隐藏示例
2014/06/11 Javascript
IE及IE6浏览器中判断JS文件加载成功失败的方法
2015/02/18 Javascript
纯JavaScript实现的兼容各浏览器的添加和移除事件封装
2015/03/28 Javascript
更高效的使用JQuery 这里总结了8个小技巧
2016/04/13 Javascript
javascript Function函数理解与实战
2017/12/01 Javascript
js实现多个倒计时并行 js拼团倒计时
2019/02/25 Javascript
基于JavaScript实现随机点名器
2021/02/25 Javascript
Python strip lstrip rstrip使用方法
2008/09/06 Python
浅谈Python的文件类型
2016/05/30 Python
python与php实现分割文件代码
2017/03/06 Python
Python开发中爬虫使用代理proxy抓取网页的方法示例
2017/09/26 Python
python reduce 函数使用详解
2017/12/05 Python
深入浅析python with语句简介
2018/04/11 Python
selenium + python 获取table数据的示例讲解
2018/10/13 Python
对python中词典的values值的修改或新增KEY详解
2019/01/20 Python
用Pytorch训练CNN(数据集MNIST,使用GPU的方法)
2019/08/19 Python
Django通过dwebsocket实现websocket的例子
2019/11/15 Python
python cv2截取不规则区域图片实例
2019/12/21 Python
BeautifulSoup中find和find_all的使用详解
2020/12/07 Python
python 实现数据库中数据添加、查询与更新的示例代码
2020/12/07 Python
西班牙床垫网上商店:Colchones.es
2018/05/06 全球购物
美国在线宠物商店:Chewy
2019/01/12 全球购物
户外婚礼策划方案
2014/02/08 职场文书
买卖协议书范本
2014/04/21 职场文书
技术负责人任命书
2014/06/05 职场文书
地理信息科学专业推荐信
2014/09/08 职场文书
源码解读Spring-Integration执行过程
2021/06/11 Java/Android
漫画「古见同学有交流障碍症」第25卷封面公开
2022/03/21 日漫