Webpack 文件分割

https://hackernoon.com/the-100-correct-way-to-split-your-chunks-with-webpack-f8a9df5b7758

• 捆绑拆分：创建更多、更小的文件（但每个请求都需要加载它们）以获得更好的缓存效果。
• 代码拆分：动态加载代码，用户只下载他们正在查看的内容所需的代码。

设置 optimization.splitChunks.chunks ='all'意味着“将 node_modules 所有内容都放入名为 vendors~main.js 的文件中”。

output.chunkFilename 和 output.filename 区分开，以便同时使用 hash chunk 和 semver chunk。

使用 cacheGroups 拆分每个 npm 包

手动添加 entry

路由动态加载

polyfill 动态加载

虽然文件多有下面这些问题，但通过实验足以说明“更多文件会更好”：

• 大量的网络请求不是更慢吗？
• 每个 Webpack 捆绑包中不是有样板代码？
• 如果有多个小文件，不就失去了压缩的优势了吗？