（一）需要

我的项目首屏加载慢，低峰时段8.7s，顶峰时段甚至有60s+ 以上的反馈。

（二）起因

Vue-cli 自身是有对webpack 打包优化的。

慢，是因为我的项目做了负载平衡 + nginx 做了限流。

（起因是避免DDOS攻打，这里仍需优化）。

因为打包后是动态文件，所以想到了应用CDN来减速的方法。

（三）步骤

1、批改vue.config.js文件导出文件门路

之前服务器上应用的是相对路径。

再次打包后，须要将我的项目门路，增加上CDN的绝对路径。

module.exports = {  publicPath: 'OSS门路', // 生产环境}

2、打包并上传到OSS中

上传除了index.html 文件的其余文件到OSS中。

3、上传index.html 文件到服务器对应门路下

最终后果

成果还挺显著的，首屏加载从8.73秒到1.75s~

哎，尽管leader不器重，但播种的是本人的。

Vue3 首屏加载还有其余的计划，之前我本人也做过一些优化，并不是我的次要问题。

感兴趣的同学能够看参考链接。

参考链接

https://juejin.cn/post/691353...