vuejs项目打包之后的首屏加载优化及打包之后出现的问题


Posted in Javascript onApril 01, 2018

一:使用CDN资源

我们在打包时,会将package.json里,dependencies对象里插件打包起来,我们可以将其中的一些使用cdn的方式加载,例如不想把vue,axios,vuex,vue-router打包到我们项目中,我们需要这样:

1:打开webpack.base.conf.js

module.exports = {
   externals: {
    ‘vue‘: ‘Vue‘,
    ‘axios‘: ‘axios‘,
    ‘vuex‘: ‘Vuex‘,
    ‘vue-router‘: ‘VueRouter‘
 }
}

2:打开router/index.js。注销掉以下两行

//import Vue from ‘vue‘
//Vue.use(Router)

3:如果你使用了vuex,把vuex/index.js(命名各有不同)中的Vue.use(Vuex)注销了

Vue.use(Vuex)

打包后可能出现的问题

1:被keep-alive包围的元素无法显示

原因:暂不明。

解决方法:不用keep-alive

推荐阅读:Vue项目使用CDN优化首屏加载问题

总结

以上所述是小编给大家介绍的vuejs项目打包之后的首屏加载优化及打包之后出现的问题,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
Javascript图像处理—平滑处理实现原理
Dec 28 Javascript
jquery实现input输入框实时输入触发事件代码
Jan 28 Javascript
浅谈js函数中的实例对象、类对象、局部变量(局部函数)
Nov 20 Javascript
jQuery与js实现颜色渐变的方法
Dec 30 Javascript
JSON字符串和JSON对象相互转化实例详解
Jan 05 Javascript
jQuery实现简单弹窗遮罩效果
Feb 27 Javascript
基于Bootstrap table组件实现多层表头的实例代码
Sep 07 Javascript
浅谈在Vue-cli里基于axios封装复用请求
Nov 06 Javascript
解决layui数据表格table的横向滚动条显示问题
Sep 04 Javascript
layui的面包屑或者表单不显示的解决方法
Sep 05 Javascript
微信内置开发 iOS修改键盘换行为搜索的解决方案
Nov 06 Javascript
一定要知道的 25 个 Vue 技巧
Nov 02 Vue.js
Vue项目使用CDN优化首屏加载问题
Apr 01 #Javascript
对Angular中单向数据流的深入理解
Mar 31 #Javascript
jQuery中复合选择器简单用法示例
Mar 31 #jQuery
jQuery中内容过滤器简单用法示例
Mar 31 #jQuery
jQuery中可见性过滤器简单用法示例
Mar 31 #jQuery
Postman模拟发送带token的请求方法
Mar 31 #Javascript
浅谈Postman解决token传参的问题
Mar 31 #Javascript
You might like
PHP4和PHP5共存于一系统
2006/11/17 PHP
php selectradio和checkbox默认选择的实现方法详解
2013/06/29 PHP
一个javascript参数的小问题
2008/03/02 Javascript
js函数般调用正则
2008/04/08 Javascript
获取css样式表内样式的js函数currentStyle(IE),defaultView(FF)
2011/02/14 Javascript
js限制文本框只能输入整数或者带小数点的数字
2015/04/27 Javascript
js实现延迟加载的方法
2015/06/24 Javascript
jQuery Form 表单提交插件之formSerialize,fieldSerialize,fieldValue,resetForm,clearForm,clearFields的应用
2016/01/23 Javascript
js验证框架实现代码分享
2016/05/18 Javascript
微信小程序 数据绑定详解及实例
2016/10/25 Javascript
jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
2017/03/09 Javascript
Angular.JS内置服务$http对数据库的增删改使用教程
2017/05/07 Javascript
解决JS内存泄露之js对象和dom对象互相引用问题
2017/06/25 Javascript
JavaScript实现的可变动态数字键盘控件方式实例代码
2017/07/15 Javascript
JS解决IOS中拍照图片预览旋转90度BUG的问题
2017/09/13 Javascript
JS script脚本中async和defer区别详解
2020/06/24 Javascript
vue移动端弹起蒙层滑动禁止底部滑动操作
2020/07/22 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
2020/07/30 Javascript
Python实现视频下载功能
2017/03/14 Python
修复 Django migration 时遇到的问题解决
2018/06/14 Python
python numpy 显示图像阵列的实例
2018/07/02 Python
python3实现zabbix告警推送钉钉的示例
2019/02/20 Python
python实现桌面气泡提示功能
2019/07/29 Python
python线程中的同步问题及解决方法
2019/08/29 Python
Pycharm无法打开双击没反应的问题及解决方案
2020/08/17 Python
Python+pyftpdlib实现局域网文件互传
2020/08/24 Python
css3截图_动力节点Java学院整理
2017/07/11 HTML / CSS
CSS3中:nth-child和:nth-of-type的区别深入理解
2014/03/10 HTML / CSS
购买大码女装:Lane Bryant
2016/09/07 全球购物
.NET初级开发工程师面试题
2014/04/18 面试题
学生会主席演讲稿
2014/04/25 职场文书
2015年项目工作总结
2015/04/29 职场文书
公司致全体员工的感谢信
2019/06/24 职场文书
导游词之江南园林狮子林
2019/09/16 职场文书
vue 自定义的组件绑定点击事件
2022/04/21 Vue.js