（13）webpack代码分割 code split

Webpack Code Splitting

Webpack Code Splitting（Webpack 代码拆分）是一种将前端应用程序的代码分割成多个小块的技术，以提高性能和加载速度。通过将代码拆分成多个文件，你可以减少初始加载时间，因为只有在需要时才加载特定部分的代码。这有助于降低应用程序的初始加载时间，提高用户体验，并减轻服务器的负载。

主要概念：

入口点（Entry Points）： 在Webpack中，一个应用程序通常有一个或多个入口点，这些入口点是Webpack开始构建依赖图的地方。每个入口点对应一个或多个输出文件，通常是一个JavaScript文件。

依赖图（Dependency Graph）： Webpack会根据入口点分析应用程序的依赖关系，并构建一个依赖图。这个图表示了模块之间的依赖关系，包括哪些模块依赖于其他模块。

拆分点（Split Points）： 拆分点是Webpack代码拆分的关键。这些点是Webpack在构建时决定将代码拆分成多个块的位置。拆分点可以是异步加载的导入语句、webpackChunkName注释或特定的配置选项。

代码块（Chunks）： 代码块是Webpack生成的文件单元，代表一组模块。它们可以是初始块（初始加载的块）或异步块（按需加载的块）。

webpack代码分割的意义

在没有代码分割之前，通过webpack打包，最终生成一个js文件bundle.js，如果项目的代码量较大，生成的bundle.js也会比较大，加载缓慢，需要