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 相关文章推荐
js的写法基础分析
Jan 17 Javascript
js取滚动条的尺寸的函数代码
Nov 30 Javascript
drag-and-drop实现图片浏览器预览
Aug 06 Javascript
javascript中href和replace的比较(详解)
Nov 25 Javascript
JSON字符串和JSON对象相互转化实例详解
Jan 05 Javascript
js仿网易表单及时验证功能
Mar 07 Javascript
详解升级react-router 4 踩坑指南
Aug 14 Javascript
JavaScript中附件预览功能实现详解(推荐)
Aug 15 Javascript
JS实现的全排列组合算法示例
Oct 09 Javascript
Java设计中的Builder模式的介绍
Mar 22 Javascript
微信小程序实现长按删除图片的示例
May 18 Javascript
详解VS Code使用之Vue工程配置format代码格式化
Mar 20 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
用ODBC的分页显示
2006/10/09 PHP
php获取某个目录大小的代码
2008/09/10 PHP
php的webservice的wsdl的XML无法显示问题的解决方法
2014/03/11 PHP
PHP计算百度地图两个GPS坐标之间距离的方法
2015/01/09 PHP
简单了解将WordPress中的工具栏移到底部的小技巧
2015/12/31 PHP
yii使用bootstrap分页样式的实例
2017/01/17 PHP
PHP文字转图片功能原理与实现方法分析
2017/08/31 PHP
jquery中get和post的简单实例
2014/02/04 Javascript
基于jquery编写的放大镜插件
2016/03/23 Javascript
Javascript 判断两个IP是否在同一网段实例代码
2016/11/28 Javascript
vue-cli的webpack模板项目配置文件分析
2017/04/01 Javascript
ReactNative中使用Redux架构总结
2017/12/15 Javascript
对Vue2 自定义全局指令Vue.directive和指令的生命周期介绍
2018/08/30 Javascript
微信小程序列表中item左滑删除功能
2018/11/07 Javascript
深入理解JS异步编程-Promise
2019/06/03 Javascript
VUE.js实现动态设置输入框disabled属性
2019/10/28 Javascript
vue.js路由mode配置之去掉url上默认的#方法
2019/11/01 Javascript
JavaScript React如何修改默认端口号方法详解
2020/07/28 Javascript
javascript运行机制之执行顺序理解
2020/08/03 Javascript
vue 获取url里参数的两种方法小结
2020/11/12 Javascript
Vue +WebSocket + WaveSurferJS 实现H5聊天对话交互的实例
2020/11/18 Vue.js
使用python获取CPU和内存信息的思路与实现(linux系统)
2014/01/03 Python
Python requests模块cookie实例解析
2020/04/14 Python
Python局部变量与全局变量区别原理解析
2020/07/14 Python
利用SVG和CSS3来实现一个炫酷的边框动画
2015/07/22 HTML / CSS
德国奢侈品网上商城:Mytheresa
2016/08/24 全球购物
销售所有的狗狗产品:Dog.com
2016/10/13 全球购物
YSL圣罗兰美妆美国官网:Yves Saint Lauret US
2016/11/21 全球购物
阿迪达斯希腊官方网上商店:adidas希腊
2019/04/06 全球购物
学习党章思想汇报
2014/01/07 职场文书
《美丽的丹顶鹤》教学反思
2014/04/22 职场文书
充分就业社区汇报材料
2014/05/07 职场文书
信息与工商管理职业规划范文:为梦想而搏击
2014/09/11 职场文书
2015年“我们的节日·中秋节”活动总结
2015/07/30 职场文书
创业计划书之餐饮馄饨店
2019/07/18 职场文书
JVM之方法返回地址详解
2022/02/28 Java/Android