webpack原理

从最小结构讲起，覆盖 tap 注册钩子、async 写法、compilation 获取、processAssets 操作产物，最后手写 BannerPlugin 和 ManifestPlugin。

从 plugin 是什么、能做什么，到 Tapable 事件流、compiler/compilation 钩子与构建对象，最后手写插件，彻底搞懂 webpack 插件机制。

从 loader 执行顺序讲起，用 pitch 阶段重写一个 style-loader，解释 !!、remainingRequest、default/toString 等关键点，并把 CSS 注入 DOM。

讲清 Loader 四个分组与装配顺序、!/-!/!! 三种请求前缀的差异，并说明哪些情况会触发 webpack 构建新模块，包括 loader 产物中的依赖。

讲解处理非 JS 文件的 loader 原理：把 Markdown 编译成 HTML 并包装为可 import 的 JS 模块，涵盖实现、options、配置、与 JS loader 的区别及注意事项。

以自定义 Babel 插件删除 console.log 为例，讲解 parse/transform/generate 三步模型、visitor 与 path、types 工具，以及如何把转换接入 Webpack loader。

以自定义 insert-comment-loader 为例，讲解 Webpack 5 中通过 this.getOptions 读取与校验 loader 配置，以及 schema、默认值和 loader 执行顺序。

从零实现一个 Webpack loader，在构建阶段自动清理 console.log，并讲清正则的局限与括号配对扫描的实现细节。

系统梳理 loader 上下文提供的 API，涵盖 getOptions、async/callback、路径请求信息、依赖管理、emitFile/日志、resolve/loadModule/importModule、环境信息与 data 传值，并给出综合示例。

按能力把 loader 分为同步、异步、raw、pitching 四类，分别说明标志、输入输出、执行时机、适用场景与代码示例，并讲清 pitch 的短路与传数据机制及各能力组合。

讲清 normal、pre、post、inline 四类 loader 的声明方式与用途，解释 pitch 与 normal 两个阶段，重点说明数组顺序 [post, inline, normal, pre] 与执行顺序 pre→normal→inline→post，以及内联 loader 的三种前缀。

从 webpack 只认识 JS/JSON 讲起，说明 loader 的本质是源码转换函数、链式执行的工作流程，介绍常见 loader、配置方式、与 plugin 的区别，并演示如何编写同步/异步/二进制 loader。

介绍 CRA 是什么，分析它构建慢、技术陈旧、配置封闭等问题与难以自行配置 webpack 的原因，澄清官方推荐框架或 Vite 的态度，并对比 Vite 的差异与迁移要点。