跳到主要内容

构建与转译总览

这一组文章解决的是:源码为什么能跑起来,构建为什么会快慢不同,为什么同样是“打包工具”,不同方案的适用范围差那么多。

推荐阅读顺序

  1. Babel
  2. Webpack
  3. Rollup
  4. Vite
  5. Rsbuild
  6. Rspack
  7. Turbopack
  8. Farm

这组内容现在覆盖什么

  • Babel:语法转换、目标环境兼容、编译阶段
  • Webpack:经典应用 bundler 和高度可定制的工程体系
  • Rollup:库构建、Tree Shaking 和产物输出
  • Vite:现代前端项目的主流构建方案,已整理为专题目录
  • Rsbuild / Rspack:Rust 路线下的现代构建体系
  • Turbopack:Next.js 主线 bundler
  • Farm:值得关注的高性能构建器路线

术语区分

  • 转译:把一种更现代或上层的语法变成另一种语法
  • 打包:把模块依赖整理成浏览器或运行时可消费的产物
  • 构建:更大的流程,通常包含转译、打包、压缩、资源处理、产物输出
  • bundler:更偏底层的打包引擎
  • 构建工具:更接近面向项目的完整工作台