Vue多页面项目打包优化详解
Vue 实现的多页面项目优化打包，主要是通过合理分割三方包来减少冗余，提升页面加载速度。随着项目的不断扩展，页面增多，三方包也会变得越来越大。这时候，你会发现即使某些页面并不使用某些插件，三方包也会被打包进去，导致 vendor.js 越来越重，页面加载速度变慢。为了应对这个问题，最常用的方案就是使用splitChunks来对三方包进行拆分，把不需要的部分从页面中剔除。通过这种方式，Webpack 可以根据页面的依赖情况自动生成对应的包，不仅减少了不必要的冗余，还能加快页面加载速度。不过有个小坑，就是分离出的三方包并不会自动注入到对应的页面中。这时候，你可以通过写一个自动注入的插件来这个问题，自动将分离后的三方包注入到页面中。这样一来，无论你新建多少个页面，都能避免手动添加每个包。简而言之，优化打包就像是在做减法，减少冗余，提高效率，保证用户体验。
文件大小：173.91KB
评论区