如何进行webpack中bundle.js运行单步调试的原理解析

Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照捆绑规则打包成一个或多个 bundle。

当 webpack 处理完所有模块并得到最终的 bundle 时，它会根据配置中指定的输出规则输出最终的文件。

webpack 的构建流程是一个串行的过程，从启动到结束会依次执行以下流程：

1. 初始化：启动 webpack 时，会从 Entry 配置项所指定的入口模块开始递归找出所有依赖的模块。

2. 编译：webpack 遍历到每个依赖模块时，都会根据配置的 Loader 规则进行转换，转换完成后会生成一个新的模块。

3. 输出：webpack 在编译完所有模块后会得到一个包含多个捆绑包（bundle）的数组。最后会根据配置的输出规则，将这些捆绑包输出到指定的文件夹。