webpack 对代码进行的优化

2021-07-01  本文已影响0人  李小白呀

路由懒加载,webpack 对代码中使用 import () 函数引入的文件,进行单独打包。将来运行时,匹配到对应的路由时,再去请求对应这个路由的 js 文件,下载好 js 文件后再执行其中的功能逻辑。降低了首屏需要的代码的体积,下载速度快了,首屏显示的也就快了

打包时读取配置文件,对于使用cdn 加载的资源,不再打入到生成的包里面

使用 tree-shaking (摇钱树功能),把代码中不会得到执行的代码去掉

在使用 ui 组件库时,配合对应的插件,进行按需加载组件(不用加载整个ui 组件库),降低代码包的体积

使用 webpack 打包时,借助thread-loader 开启多线程打包,借助 cache-loader 使用缓存,加速构建

通过分离配置项,将通用的配置提取过来,在生产/开发的配置中引用通用配置,简化 webpack配置的繁琐

上一篇下一篇

猜你喜欢

热点阅读