前端领域新一代构建工具的对比

近年涌现出大量改善开发人员体验的新的开发者工具，包括但不限于webpack、Babel、Rollup、Parcel、create-react-app。我们的目的是了解它们，必要时做出最佳选择。

本文将按照从底层到上层的封装粒度，以 esbuild、snowpack、vite、wmr 的顺序进行介绍。

每个工具的都在不同程度上支持以下功能：

• 对原生 JavaScript 模块的一流支持

• TypeScript 编译(但不进行类型检查)

• JSX

• 用于扩展性的插件 API

• 内置开发服务器

• CSS bundling 和支持 CSS-in-JS 库。

esbuild

esbuild 使用 go 语言编写，由于相对 node 更为底层，且不提供 AST 操作能力，所以代码执行效率更高，根据其官方 benchmark 介绍提速有 10～100 倍：

esbuild 目前 处于 0.14.38 版本，还未完全准备好用于稳定生产的 1.0 版本。减少等待构建运行的时间，能改善开发体验，但是esbuid相对较为底层，因此在拉入依赖关系和配置环境上环节上会花费时间，使用Rollup 和 terser 的bundl