JS工具变化太快了:rocket:.本文将从“编译器”、“打包器”、“包管理器”、“第三方库开发”、“Web应用开发”等方面,自下而上地回顾2022年JavaScript开发工具的生态。编译器编译器负责将输入代码转换成某种目标输出格式。本文只关注JS和TS编译器,它可以将现代JS和TS转换成特定版本的ECMAscript,兼容浏览器和最新版本的Node.js。编译器从tsc和babel变成了swc和esbuild,编写语言也从高级解释型语言变成了更快的编译型语言。编译器生态目前正在经历一个非常重要和巨大的转型过程。这样的改造使得编译速度提高了10到100倍。下图来自esbuild官网。如果您正在升级您的开发工具或开始一个新项目,请尝试这些下一代编译器。虽然成熟度不如tsc或者babel,但是快了将近100倍的build真的很香。不幸的是,swc和esbuild都不能进行类型检查,它们只是试图尽可能地加快速度。如果项目使用的是TS,最好在工具链中使用tsc进行类型检查,不要放弃这个能力。另外,由于很多项目都依赖tsc,为了突破这个瓶颈,swc的作者正在将tsc移植到Go。Babelvstsc之前对两者做过对比,传送门:2022,BabelvsTypeScript,谁更适合代码编译。综上所述,当项目中两者都存在时,最好使用babel编译代码,使用tsc进行类型检查,生成.d.ts文件。swcvsesbuildswc和esbuild都是性能相当的优秀且速度极快的JS/TS编译器。许多大公司已经开始在生产环境中使用它们。比较它们时,更多的是比较集成它们的上层工具,而不是比较它们本身。使用swc的上层工具有:Vercel和Next.jsDeno的linter、formatter和docsParcelnx使用esbuild的上层工具有:ViteNuxt.jsRemixSvelteKittsupPackagerPackager负责将所有源文件打包在一起,通常用于打包第三方派对图书馆和网络应用程序。webpack和rollup是现代打包工具的瑞士军刀。扩展性很强,社区插件生态也很好,可以覆盖绝大部分打包场景。比如在webpack和rollup中,你可以使用上述任何一种编译器来编译TS代码。而parcel提供了一种零配置的快速打包方式。它更注重简单性而不是可扩展性,并且在内部使用swc作为编译器。其实swc和esbuild也提供了基本的打包能力,但是和这些打包器相比,功能还不够全面,这里就不一一列举了。更详细的对比请参考tool.report。包管理器包管理器负责管理NPM包依赖项。包管理器有很多历史。总结如下:这些包管理器目前具有类似的功能。不要太纠结于必须使用哪一个。跟随你的心。作为后起之秀,pnpm解决了其他包管理器留下的痛点。最近比较火,相信以后会越来越好。随着yarnv1的淘汰和v2的诞生,虽然v2这几年进步很快,但是很多人已经不再使用yarn了。yarn的即插即用(PnP)特性虽然不错,但是可以将同一个系统上不同项目引用的同一个依赖的同一个版本指向同一个缓存目录,提高依赖安装的速度。但实际上它通常只用于非常大的monorepos项目。延伸阅读:选择第三方NPM包时的5个最佳实践,看看明星项目是如何被选中的:这些项目都没有使用yarnPnP。第三方库开发这些工具帮助开发者打包和分发第三方NPM包。如果您想在2022年开发一个新库,您可以使用它们来简化您的工作流程。如果要构建TS库,想用esbuild提速可以考虑tsup,想要附加功能可以考虑tsdx。微包可用于构建JS/TS库。Vite主要用于构建Web应用,但也支持类库的构建,整体上更加全面。对于monorepos,nx有着广阔的前景。然而,目前这些工具中的大多数都不能很好地支持TSmonorepos(TSmonorepos可以利用项目引用并将TS代码结构拆分成更小的部分)。在这种情况下,建议使用tsc检查类型并生成d.ts文件,使用tsup编译各个子包。真实案例请参考react-notion-x。这些用于Web应用程序开发的高级工具和框架将帮助开发人员屏蔽所有细节,以更好地构建现代Web应用程序。对于开发ReactWeb应用程序,强烈建议使用Next.js。Next.js目前社区支持度高,非常活跃,并且与部署平台Vercel也有深度集成。Remix可以看作是Next.js的替代品。和react-router出自同一个开发团队,但目前比较新,可以持续关注。开发Vueweb应用,选择Nuxt.js或者Vite都没有问题。国内环境推荐Vite。Snowpack已经在2022年4月20日正式宣布不再主动维护,这意味着不推荐用于新项目,您可以选择Vite作为替代方案。如果你想要一个更轻便的工具,你可以试试Parcel。结论从以上来看,以swc或esbuild为编译器,以webpack或rollup为打包器的开发工具数量差不多有50-50个。现代网络应用程序开发近几年发展迅速。在工具领域,我们现在有很多很多的选择。希望本文能对您以后的技术选择有所帮助。
