Vue项目加载慢，有什么方法可以找到问题原因，怎么解决？

什么导致了首页初步加载过慢

请看下面一张图就清楚了

即app.js文件过大导致的。。。

如何来处理

vue-route 懒加载

component： resolve =>require([''],resolve)

在webpack打包的过程中，将多余文件去掉，如map文件

即在config/index.js中将productionSourceMap的值修改为false，就明并可以在编译时不生成.map文件了

cdn

在项目开发中，我们会用到很多第三方库，如果可以按需引入，我们可以只引入自己需要的组件，来减少所占空间，但也会有一些不能按需引入，我们可以采用CDN外部加载，在index.html中从CDN引入组件，去掉拆早其他页面的组件import，修改webpack.base.config.js，在externals中加入该组件，这是为了避免编译时找不到组件报错。

vue 异步加载

vue异步加载分为组件的异步加载和请求时的异步加载两种情况。

组件异步加载即为路由的异步

方法一：

方法三：webpack提激御迹供的require.ensure()

vue-router配置路由，使用webpack的require.ensure技术，也可以实现按需加载。

这种情况下，多个路由指定相同的chunkName，会合并打包成

可能到时候打包的时候会出现路径找不到情况，这时候在webpack.prod.conf.js中修改下一些文件

微信小程序每次升级部署，都需要在设置里面清理一下缓存，新的得功能才可以显示，就很麻烦，因此找到以下解决方法，通过配置 index.vue或者vue.config.js配置，原理是每次升级以后打开小程旁山序读取js文件，都是不一样得文件，然后再一次从中悉新加载一下，卖启乎从而实现自动清理缓存。

一、在index.vue文件添加如下代码（不推荐）

二、在打包的时候给每个打包文件加上 hash 值，一般是在文件后面加上时间戳，通过vue.config.js配置

摁，我之前在开发小程序的时候也遇到了这样的问题局猛，接口返回速度则睁很快，但是要好几秒才在页面显示，当时我是胸有成竹的把锅甩给了写接口的哥们。

但是很遗桐盯桥憾，这基本就是前端的问题，问题出在接口回调之后处理数据显示的方法上。你可以在返回数据之后直接把数据打到控制台，看看上不上秒出；如果是（几乎肯定是），那就排查回调之后的方法，哪个处理起来比较耗时。console.time 用起来。

祝好运。

---