一、vender.js文件过大问题 项目中使用了element-ui vendor.sj文件越小也就意味着首屏的速度越快,为了让vue项目首屏速度变快,在使用了路由懒加载。
node_modules[\\/]/, priority: -10, // 权重越大,打包优先级越高 // filename: 'js/vender.js...' //将代码打包成名为vender.js的文件 name: 'vender' }, default...这个数组就是我们要打包进页面的js,main和about分别代表入口的名字,vender就是我们定义optimization时里面cacheGroups属性值中vendors中定义的name,当代码超过30000b时就会生成vender.js
console.log(add(1, 2)) } }) 同样,打包,然后点击开发者工具的 详情,点击 本地代码-> 依赖分析: 从上图可以看到,我们在 主包 中的的 vender.js
以上的配置为: // vender.js 文件抽离基础库到单独的一个文件里防止跟随业务代码被刷新 // 所有页面都依赖的第三方库 // react基础 import 'react'; import 'react-dom
// vender.js 文件抽离基础库到单独的一个文件里防止跟随业务代码被刷新 // 所有页面都依赖的第三方库 // react基础 import 'react'; import 'react-dom
以上的配置为:// vender.js 文件抽离基础库到单独的一个文件里防止跟随业务代码被刷新 // 所有页面都依赖的第三方库 // react基础 import 'react'; import 'react-dom
/src/vendor.js' } 在分离应用app.js与第三方包时,可以将第三方包单独打包成vender.js,我们将第三方包打包成一个独立的chunk,内容hash值保持不变,这样浏览器利用缓存加载这些第三方
领取专属 10元无门槛券
手把手带您无忧上云