webpack打包导致App.js很大,访问页面的时候会很慢的问题解决【vue-cli3打包】

问题说明:打包导致 js 很大,然后访问特别慢。

我把 vue-cli 升级成了 vue-cli3之后打包就有两个js,并且体积相当大,导致发布后访问的速度超级慢。

之前打包都是分了很多个小的js,具体是因为没有配置还是因为什么。暂时不清楚。如果你有好的办法可以在下面留言。

webpack打包导致App.js很大,访问页面的时候会很慢的问题解决【vue-cli3打包】

解决这个问题,有两种办法:

一:打包gzip (只需要在nginx.conf 里面配置一下就可以了,具体代码放在下面了直接复制粘贴就好)

gzip            on;
gzip_min_length 1000;
gzip_proxied    expired no-cache no-store private auth;
gzip_types      text/plain application/xml application/javascript;

webpack打包导致App.js很大,访问页面的时候会很慢的问题解决【vue-cli3打包】

第二种:使用 CDN 加速

简单来说,就是把你的 js 放在快速的服务器上。

我是把我的 两个 js 放在了 七牛云服务器上。然后去修改你的 index.html,把引用的位置改成 七牛云的地址

webpack打包导致App.js很大,访问页面的时候会很慢的问题解决【vue-cli3打包】

 

说明:其实第一种方法不怎么适合你的js过大,比如我的 js 是 8M,用第一种方法的效果太不明显。第二种方法效果特别明显。

我最开始访问页面 大概  5分钟,用了第一种方法3分钟。    第二种方法,3秒。