为什么webpack生成多个js文件

Question

我是React和webpack的新手，只是关于webpack生成的js文件的一些问题。我一直以为webpack会将所有依赖项js都放到一个bundle.js文件中，但是当我检查浏览器时，实际上看到了三个文件：

0.chunk.js bundle.js main.chunk.js

以下是我的问题：

Q1-为什么Webpack不能只获取所有内容并将它们捆绑到一个bundle.js文件中？

第2季度0.chunk.js，main.chunk.js的目的是什么？

Q3-谁将每个js文件的脚本元素插入index.html文件，webpack或加载程序中？

Answer 1

问题1：为什么Webpack不会将所有内容都捆绑到一个bundle.js文件中

生成块是一种可选功能。 Webpack默认情况下不生成块。在第二季度中解释了生成块可能有用的原因。

第2季度0.chunk.js，main.chunk.js 的目的是什么

块是一个单独的文件，由多个入口点之间共享的通用模块组成。将这些通用模块与捆绑包分开，可以使这些块最初被加载一次并存储在缓存中以备后用。

Q3-谁将每个.js文件的脚本元素插入index.html文件，Webpack或加载程序中？

Webpack。加载程序用于打包任何非JavaScript资源，并帮助Webpack编译和捆绑那些非JavaScript资源，因为Webpack本身只能理解javascript。在生成捆绑包期间或之前，加载程序会处理其文件。

Answer 2

Q1。 为什么Webpack不能只获取所有内容并将它们捆绑到一个bundle.js文件中？

这允许延迟加载和代码拆分，从而使您的应用程序快速加载。

Q2。 0.chunk.js，main.chunk.js的目的是什么？

这些是由webpack命名的块。他们拥有可转换为在旧版本和新版本浏览器中都可以使用的JS代码。

Q3。谁将每个js文件的脚本元素插入index.html文件，Webpack或加载程序中？

标签由webpack插入。 Webpack使用加载程序来使用非JS资源，例如图像和样式表等。

希望有帮助