vue-cli 如何打包上线的方法示例


Posted in Javascript onMay 08, 2018

以vue创建的官方例子为例子,我们在开发环境的时候会 npm run dev ,生成

vue-cli 如何打包上线的方法示例

而想要打包成一份vue-cli 如何打包上线的方法示例很简单, 只需要 npm run build 这个命令

这两种命令的配置文件在config的index.js 一种是build 一种是dev ,而我们想要在本地查看打包后的成果,需要在assetsPublicPath 改变它的路径, 具体为什么,可以看index.html引入的文件路径

vue-cli 如何打包上线的方法示例

vue-cli 如何打包上线的方法示例

之后只需要放在服务器上运行就好了。

*常用技巧

1.如果在config -> index.js 中的 build 代码中的 productionSourceMap的值设为false ,打包后文件体积可以减少百分之八十

2.如果设置build文件夹下的webpack.prod.conf.js中HtmlWebpackPlugin插件配置参数添加hash: true,即会使打包生成的index.html中的js和css路径带有?+随机字符串,也就是版本控制

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
不错的新闻标题颜色效果
Dec 10 Javascript
解析javascript 实用函数的使用详解
May 10 Javascript
js获取会话框prompt的返回值的方法
Jan 10 Javascript
jQuery使用fadeout实现元素渐隐效果的方法
Mar 27 Javascript
javascript中undefined与null的区别
Aug 16 Javascript
微信小程序 二维码canvas绘制实例详解
Jan 06 Javascript
Bootstrap导航条学习使用(一)
Feb 08 Javascript
JS实现的模仿QQ头像资料卡显示与隐藏效果
Apr 07 Javascript
node+vue实现用户注册和头像上传的实例代码
Jul 20 Javascript
Node.js 中使用 async 函数的方法
Nov 20 Javascript
详解Immutable及 React 中实践
Mar 01 Javascript
element-ui中按需引入的实现
Dec 25 Javascript
使用vue-cli打包过程中的步骤以及问题的解决
May 08 #Javascript
详解React-Router中Url参数改变页面不刷新的解决办法
May 08 #Javascript
angularjs实现的购物金额计算工具示例
May 08 #Javascript
Vue微信项目按需授权登录策略实践思路详解
May 07 #Javascript
Vue + better-scroll 实现移动端字母索引导航功能
May 07 #Javascript
node使用promise替代回调函数
May 07 #Javascript
node 使用 async 控制并发的方法
May 07 #Javascript
You might like
PHP 的ArrayAccess接口 像数组一样来访问你的PHP对象
2010/10/12 PHP
php 模拟post_验证页面的返回状态(实例讲解)
2013/10/28 PHP
JS中剪贴板兼容性、判断复制成功或失败
2021/03/09 Javascript
使用javascript做的一个随机点名程序
2014/02/13 Javascript
JQuery 在线引用及测试引用是否成功
2014/06/24 Javascript
jquery实现的下拉和收缩效果示例
2014/08/21 Javascript
Extjs grid panel自带滚动条失效的解决方法
2014/09/11 Javascript
jquery实现先淡出再折叠收起的动画效果
2015/08/07 Javascript
js实现点击文本框显示日期选择器特效代码分享
2020/05/21 Javascript
使用Object.defineProperty实现简单的js双向绑定
2016/04/15 Javascript
jQuery验证插件validate使用详解
2016/05/11 Javascript
AngularJS控制器之间的数据共享及通信详解
2016/08/01 Javascript
详解微信小程序设置底部导航栏目方法
2017/06/29 Javascript
JavaScript中in和hasOwnProperty区别详解
2017/08/04 Javascript
vue父组件异步获取数据传给子组件的方法
2018/07/26 Javascript
Nuxt页面级缓存的实现
2020/03/09 Javascript
解决antd日期选择组件,添加value就无法点击下一年和下一月问题
2020/10/29 Javascript
[00:12]2018DOTA2亚洲邀请赛SOLO赛 MidOne是否中单第一人?
2018/04/05 DOTA
给Python IDLE加上自动补全和历史功能
2014/11/30 Python
Python中对列表排序实例
2015/01/04 Python
分析Python编程时利用wxPython来支持多线程的方法
2015/04/07 Python
Python3实现从文件中读取指定行的方法
2015/05/22 Python
用tensorflow构建线性回归模型的示例代码
2018/03/05 Python
在PYQT5中QscrollArea(滚动条)的使用方法
2019/06/14 Python
Django项目之Elasticsearch搜索引擎的实例
2019/08/21 Python
python seaborn heatmap可视化相关性矩阵实例
2020/06/03 Python
你不知道的5个HTML5新功能
2016/06/28 HTML / CSS
12个不为大家熟知的HTML5设计小技巧
2016/06/02 HTML / CSS
Bose法国官网:购买耳机、扬声器、家庭影院、专业音响
2017/12/21 全球购物
全球最大的户外用品零售商之一:The House
2018/06/12 全球购物
模范家庭事迹材料
2014/02/10 职场文书
产品销售计划书
2014/05/04 职场文书
上班迟到检讨书300字
2014/10/18 职场文书
单位考核聘任报告
2015/03/02 职场文书
行政前台岗位职责
2015/04/16 职场文书
2015年庆祝国庆节66周年演讲稿
2015/07/30 职场文书