
├── 1.AST、Babel、依赖
│ ├── 1-1 babel与AST
│ ├── 1-2 把let变成var
│ ├── 1-3 将代码转化为ES5
│ ├── 1-4 分析index.js的依赖
│ ├── 1-5 递归地分析嵌套依赖
│ └── 1-6 静态分析循环依赖
├── 2.Webpack核心原理
│ ├── 2-1 webpack 要解决的两个问题
│ ├── 2-2 编译 import 和 export 关键字
│ ├── 2-3 把多个文件打包成一个
│ ├── 2-4 最终文件长什么样子
│ └── 2-5 打包器完成
├── 3.Loader原理
│ ├── 3-1 如何加载 CSS 文件
│ ├── 3-2 创建 CSS loader
│ ├── 3-3 发现打包器的问题
│ ├── 3-4 阅读style-loader源码理解 webpack
│ ├── 3-5 raw-loader和css-loader源码赏析
│ └── 3-6 loader 面试题
├── 4.阅读Webpack源码前的准备
│ ├── 4-1 课程优势
│ ├── 4-2 两种调试 webpack-cli 的方法
│ ├── 3 第三种调试方式 yarn link
│ └── 4 其他准备工作
├── 5.逐行于都Webpack源码(上)
│ ├── 1 分析 webpack-cli 是如何调用 webpack 的
│ ├── 2 创建编译器 Compiler 的过程
│ ├── 3 Tapable 是什么
│ ├── 4 分析 Webpack 的整体流程
│ ├── 5 Webpack 是如何处理 Entry 的
│ └── 6 你怎么知道 facotery 就是 nmf 呢?
├── 6.逐行阅读Webpack源码(下)
│ ├── 1 回顾上节课
│ ├── 2 factory.create 与 module
│ ├── 3 _source 与 _ast
│ ├── 4 Webpack 借助 acorn 的 parser 分析 JS
│ ├── …
│ ├── 6 Webpack 分析 JS 的过程
│ ├── 7 Webpack 整体流程复述
│ └── 8 你可以看懂别人写的博客了
├── 7.Webpack插件原理
│ ├── 1 Webpack Plugin 工作机制
│ ├── 2 插件 1 源码讲解
│ ├── …
│ ├── 5 loader vs plugin 区别
│ ├── 6 如何自己写 plugin
│ └── 7 看看网上的相关文章
├── 8.Webpack高级配置举例(1)
│ ├── 1 如何使用课程中的代码
│ ├── 2 让webpack输出的代码支持IE
│ ├── 3 用babel-loader打包JS
│ ├── 4 用babel-loader打包JSX
│ ├── 5 给webpack配置ESLint插件
│ ├── 6 用babel-loader打包TypeScript
│ ├── …
│ ├── 8 用babel-loader打包TSX
│ ├── …
│ ├── 10 让JS和TS支持@alias
│ └── …
├── 9.Webpack高级配置举例(2)
│ ├── 1 让 webpack 支持 SCSS
│ ├── 2 SCSS 自动 import 全局文件
│ ├── 3 SCSS 分享变量给 JS
│ ├── 4 让 Webpack 支持 LESS 文件
│ ├── …
│ ├── 8 支持 Stylus 文件
│ ├── 9 Webpack config 重构
│ ├── 10 在生产环境提取单独的CSS文件
│ └── 11 自动生成HTML页面
└── 10.Webpack高级配置举例(3)
├── 1 Webpack 优化之单独打包 runtime
├── 2 为什么要单独打包 runtime
├── 3 Webpack 优化之用 splitChunks 将 node 依赖单独打包
├── …
├── 5 Webpack 多页面
├── 6 Webpack 优化之 common 插件
└── 7 无限多页面的实现思路