解决vue打包后vendor.js文件过大问题


Posted in Javascript onJuly 03, 2019

第一步、cdn引入各种包

index.html中cdn的方式引入vue、vuex、axios、element-ui、vue-router等包,如下图:

解决vue打包后vendor.js文件过大问题

第二步、在使用vue等包的地方,注释掉import引入

在所有使用vue的地方注释掉引入的vue等包,但是Vue.use(axios)、Vue.use(VueRoter)、Vue.use(vuex)等依然要使用,除了Vue.use(ElementUI), 如果加上这句话,还是会打包element-ui到vendor.js文件中

在main.js

解决vue打包后vendor.js文件过大问题

在store文件加中的index.js

解决vue打包后vendor.js文件过大问题

在api/request.js文件中

解决vue打包后vendor.js文件过大问题

在router/index.js文件中

解决vue打包后vendor.js文件过大问题

第三步、打包忽视掉vue等包

在webpack.base.conf.js

解决vue打包后vendor.js文件过大问题

第四步、如果打包后的文件还是比较大,就采用路由懒加载的方式加载路由

解决vue打包后vendor.js文件过大问题

最终打包结果

vendor.js的大小由原来的988k, 降到235k

解决vue打包后vendor.js文件过大问题

总结

以上所述是小编给大家介绍的解决vue打包后vendor.js文件过大问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
基于jquery的超简单上下翻
Apr 20 Javascript
javascript中方便增删改cookie的一个类
Oct 11 Javascript
javascript数组去重3种方法的性能测试与比较
Mar 26 Javascript
Javascript玩转继承(三)
May 08 Javascript
Node.js中创建和管理外部进程详解
Aug 16 Javascript
jQuery表单验证功能实例
Aug 28 Javascript
jquery自动补齐功能插件flexselect用法示例
Aug 06 Javascript
JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
Nov 10 Javascript
Require.js的基本用法详解
Jul 03 Javascript
详解刷新页面vuex数据不消失和不跳转页面的解决
Jan 30 Javascript
vue实现组件之间传值功能示例
Jul 13 Javascript
javascript实现函数柯里化与反柯里化过程解析
Oct 08 Javascript
Vue.js递归组件实现组织架构树和选人功能案例分析
Jul 03 #Javascript
vuex 动态注册方法 registerModule的实现
Jul 03 #Javascript
微信小程序中如何使用flyio封装网络请求
Jul 03 #Javascript
JQuery+Bootstrap 自定义全屏Loading插件的示例demo
Jul 03 #jQuery
使用vue实现各类弹出框组件
Jul 03 #Javascript
elementUI vue this.$confirm 和el-dialog 弹出框 移动 示例demo
Jul 03 #Javascript
使用微信SDK自定义分享的方法
Jul 03 #Javascript
You might like
无线电波是什么?它是怎样传输的?
2021/03/01 无线电
php生成动态验证码gif图片
2015/10/19 PHP
简述php环境搭建与配置
2016/12/05 PHP
PHP如何使用cURL实现Get和Post请求
2020/07/11 PHP
javascript下过滤数组重复值的代码
2007/09/10 Javascript
js之事件冒泡和事件捕获详细介绍
2013/10/28 Javascript
JavaScript版的TwoQueues缓存模型
2014/12/29 Javascript
JavaScript实现更改网页背景与字体颜色的方法
2015/02/02 Javascript
JQuery判断checkbox是否选中及其它复选框操作方法合集
2015/06/01 Javascript
js日期插件dateHelp获取本月、三个月、今年的日期
2016/03/07 Javascript
js计算时间差代码【包括计算,天,时,分,秒】
2016/04/26 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
2016/06/12 Javascript
AngularJS中指令的四种基本形式实例分析
2016/11/22 Javascript
jQuery实现动态给table赋值的方法示例
2017/07/04 jQuery
js 事件的传播机制(实例讲解)
2017/07/20 Javascript
原生JS控制多个滚动条同步跟随滚动效果
2017/12/22 Javascript
angularJs中$http获取后台数据的实例讲解
2018/08/08 Javascript
详解vue中的computed的this指向问题
2018/12/05 Javascript
微信小程序实现九宫格抽奖
2020/04/15 Javascript
[05:22]DOTA2 2015国际邀请赛中国区预选赛首日TOP10
2015/05/26 DOTA
[52:39]完美世界DOTA2联赛PWL S3 CPG vs Forest 第一场 12.16
2020/12/17 DOTA
利用Python操作消息队列RabbitMQ的方法教程
2017/07/19 Python
PyCharm设置护眼背景色的方法
2018/10/29 Python
python登录WeChat 实现自动回复实例详解
2019/05/28 Python
解决keras backend 越跑越慢问题
2020/06/18 Python
详解Python中list[::-1]的几种用法
2020/11/16 Python
一家外企的面试题目(C/C++面试题,C语言面试题)
2014/03/24 面试题
TCP/IP中的TCP和IP分别承担什么责任
2012/04/21 面试题
互联网电子商务专业毕业生求职信
2014/03/18 职场文书
个人自我鉴定总结
2014/03/25 职场文书
领导干部“四风”查摆问题个人整改措施
2014/10/28 职场文书
2015年超市工作总结范文
2015/05/26 职场文书
2016七夕情人节寄语
2015/12/04 职场文书
2016高中社会实践心得体会范文
2016/01/14 职场文书
浅谈spring boot使用thymeleaf版本的问题
2021/08/04 Java/Android
Golang map映射的用法
2022/04/22 Golang