脚本宝典收集整理的这篇文章主要介绍了vue项目优化，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

粒子特效：

vue-particles

 

nprogress 

网页加载进度条

全局前置守卫   NProgress.start()

全局后置守卫 ：NProgress.done()

 

页面loding

单个页面加loading、阻止重复点击 通过element-ui的 Loading 加载（用户体验度最高的）

 

axios封装

• 封装axios导出request实例对象（timeout、baseURL、.env、headers content-type、

• 请求拦截器（token、CancelToken、Loading

• 响应拦截器-成功（关闭Loading、 接口权限、TOKEN过期、res.data.data过滤

• 响应拦截器-失败（关闭Loading、timeout处理 、404、canceled、邮件报警捕捉前端异常

 

vue-lazyload     

vue图片懒加载

 vue文件中将需要懒加载的图片绑定 v-bind:src 修改为 v-lazy 

 

路由/组件懒加载

关闭预加载prefetch

chainWebpack: config => { // 移除 prefetch 插件 config.plugins.delete('prefetch')},

解决首屏加载过慢

 

CDN优化第三方库

通过 externals 加载外部CDN资源

映入了CDN就不要再打包这个模块了，所以通过 externals 来排除这个模块

脚本宝典总结

以上是脚本宝典为你收集整理的vue项目优化全部内容，希望文章能够帮你解决vue项目优化所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。