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 相关文章推荐
限制复选框的最大可选数
Jul 01 Javascript
浅谈JavaScript中面向对象技术的模拟
Sep 25 Javascript
用javascript判断IE版本号简单实用且向后兼容
Sep 11 Javascript
ZeroClipboard插件实现多浏览器复制功能(支持firefox、chrome、ie6)
Aug 30 Javascript
jQueryMobile之Helloworld与页面切换的方法
Feb 04 Javascript
HTML5实现留言和回复页面样式
Jul 22 Javascript
理解javascript中的MVC模式
Jan 28 Javascript
批量下载对路网图片并生成html的实现方法
Jun 07 Javascript
js实现可键盘控制的简单抽奖程序
Jul 13 Javascript
BootStrap Fileinput初始化时的一些参数
Dec 30 Javascript
JS实现的3des+base64加密解密算法完整示例
May 18 Javascript
vue 更改连接后台的api示例
Nov 11 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
德生PL990,目前市面上唯一一款便携式插卡蓝牙全波段高性能收音机
2021/03/02 无线电
解决文件名解压后乱码的问题 将文件名进行转码的代码
2012/01/10 PHP
yii2 commands模式以及配置crontab定时任务的方法
2017/08/19 PHP
laravel dingo API返回自定义错误信息的实例
2019/09/29 PHP
JavaScript 创建对象
2009/07/17 Javascript
Knockout数组(observable)使用详解示例
2013/11/15 Javascript
jQuery统计指定子元素数量的方法
2015/03/17 Javascript
jquery图片倾斜层叠切换特效代码分享
2015/08/27 Javascript
举例讲解JavaScript中将数组元素转换为字符串的方法
2015/10/25 Javascript
JavaScript模块化开发之SeaJS
2015/12/13 Javascript
BootStrap点击下拉菜单项后显示一个新的输入框实现代码
2016/05/16 Javascript
Vuejs实现带样式的单文件组件新方法
2017/05/02 Javascript
Vue.js2.0中的变化小结
2017/10/24 Javascript
微信小程序页面跳转功能之从列表的item项跳转到下一个页面的方法
2017/11/27 Javascript
对angularjs框架下controller间的传值方法详解
2018/10/08 Javascript
详解三种方式解决vue中v-html元素中标签样式
2018/11/22 Javascript
微信小程序当前时间时段选择器插件使用方法详解
2018/12/28 Javascript
vue递归组件实战之简单树形控件实例代码
2019/08/27 Javascript
Vue v-model组件封装(类似弹窗组件)
2020/01/08 Javascript
vue移动端的左右滑动事件详解
2020/06/17 Javascript
解决echarts中横坐标值显示不全(自动隐藏)问题
2020/07/20 Javascript
[01:15:44]首部DOTA2纪录片今日23时全网上映
2014/03/19 DOTA
[50:59]2018DOTA2亚洲邀请赛 4.7 总决赛 LGD vs Mineski第四场
2018/04/10 DOTA
[01:34]DAC2018主赛事第四日五佳镜头 Gh巨牙海民助Miracle-死里逃生
2018/04/07 DOTA
跟老齐学Python之坑爹的字符编码
2014/09/28 Python
跟老齐学Python之不要红头文件(2)
2014/09/28 Python
在Python的Django框架中创建和使用模版
2015/07/15 Python
Python爬虫包 BeautifulSoup  递归抓取实例详解
2017/01/28 Python
python 文件操作删除某行的实例
2017/09/04 Python
Python实现的购物车功能示例
2018/02/11 Python
Python生成器定义与简单用法实例分析
2018/04/30 Python
linux 下python多线程递归复制文件夹及文件夹中的文件
2020/01/02 Python
HTML5新增form控件和表单属性实例代码详解
2019/05/15 HTML / CSS
公安学专业求职信
2014/07/27 职场文书
信用卡逾期证明示例
2014/09/13 职场文书
唤醒紫霞仙子,携手再游三界!大话手游X《大话西游》电影合作专属剧情任务
2022/04/03 其他游戏