Webpack打包流程
Webpack打包流程的核心步骤包括初始化配置、解析入口文件、构建依赖图、模块转换、资源优化和输出文件。该流程通过递归分析模块依赖关系，结合加载器和插件处理各类资源，最终生成优化后的静态文件。
核心流程概述
- 初始化配置：读取
webpack.config.js文件，确定入口（entry）、输出路径（output）、加载器（loaders）和插件（plugins）等基础设置。 - 解析入口文件：从配置的入口文件（如
index.js）开始，递归分析其依赖的模块（如JS、CSS、图片等），形成依赖关系图。 - 模块转换：
- 使用加载器（如
babel-loader、css-loader）转换非JS文件。 - 插件（如
HtmlWebpackPlugin）处理额外任务（如生成HTML文件）。
- 使用加载器（如
- 资源优化：根据生产模式（
mode: 'production'）压缩代码、拆分代码块（code splitting）等。 - 输出文件：将处理后的资源合并为静态文件（如
bundle.js），输出到指定目录（如/dist）。