描述一下场景:
react项目,a, b页面已经使用了懒加载,build后产生:
- index.js
- a.js
- b.js
a 页面使用了一个比较大的包 x,理想状态肯定是:
- a.js 中包含 x
- 当打开a页面时候才加载x
但实际情况是,x会被打包进index.js,
聪明的你想到了manualChunks
rollupOptions: {
output: {
manualChunks: {
bigBundle: ['bigBundle'],
}
},
},
使用了这个之后你会发现,bigBundle确实有独立文件,虽然有独立文件,但是它仍然会被第一时间加载。那么这个分割毫无意义 —— 反正都会被加载,分不分割有什么区别?
所以说目前看,如果这个bug不解决,manualChunks这个配置就毫无意义。