1. 调试 build 过程
React 源码工程，添加 .vscode/launch.json
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug Build",
"skipFiles": [
"<node_internals>/**"
],
"runtimeExecutable": "npm",
"runtimeArgs": [
"run-script",
"debug-build"
],
"port": 5858,
}
]
}
修改 package.json，添加 debug-build npm scripts
"debug-build": "node --inspect-brk=5858 ./scripts/rollup/build.js",
按 F5 进行调试
2. 构建逻辑
可以看这里，github: react-tour
将该仓库 v17.0.2 分支的 .tour/ 拷贝到 React 源码目录（tag 为 v17.0.2）即可。
需要 VSCode 安装 Code Tour 插件
业务逻辑概览：
- 根据用户传入的参数，来决定对哪些模块以什么方式进行打包
- 当前（React v17.0.2）总共包含 52 个模块，这些模块通过
createBundle循环处理 - 每一个模块生成相应的 rollup 构建配置
- 每个模块构建完并生成构建产物之后，进行一些拷贝操作，把 package.json 和 readme.md 都复制到构建产物目录
参考
Node.js debugging in VS Code
VSCode: Code Tour
github: thzt/react-tour
