webpack配置之---output.chunkLoading

output.chunkLoading

webpack.output.chunkLoading 配置项用于指定 Webpack 如何加载异步 chunk（即按需加载的代码块）。在现代 Webpack 版本中，异步代码分割成为了非常常见的功能，chunkLoading 配置项就用于控制 Webpack 加载这些异步模块的方式。

在 Webpack 中，异步加载通常通过 import() 语法进行，当浏览器需要加载某个按需分割的 chunk 时，会通过网络请求来获取该文件，chunkLoading 配置项决定了如何发起这个请求。

output.chunkLoading 配置项可以接受以下几种值：

1. 'auto' (默认值)
   Webpack 会根据当前环境自动选择合适的 chunk 加载方式。在大多数情况下，'auto' 会选择 Webpack 最适合的加载方式。

2. 'jsonp'
   使用 JSONP（JSON with Padding）机制加载异步 chunk。JSONP 是传统的异步加载技术，Webpack 会生成一段通过 <script> 标签加载 chunk 的代码。每个 chunk 会被包装成一个函数，返回数据后调用指定的回调函数。

3. 'import'
   使用 import() 语法进行异步模块加载。这是 Webpack 5 引入的更现代的异步加载方式，使用 ES Module 的原生 import() 功能来加载 chunk。该方法通过浏览器原生支持的机制加载 JavaScript 文件，不依赖于 <script> 标签。

4. 'require'
   使用 require.ensure() 进行模块加载，这种方式属于 Webpack 4 及以前版本的旧加载方式。require.ensure() 通过动态 require() 加载代码块，在 Webpack 5 中不推荐使用，但仍被支持。