Vue 团队“王炸”新作！又一打包工具发布！

作者：前端开发爱好者

咱就说，这前端工具链 的江湖，本来就已经风起云涌了，结果 Vue 团队这边还没等大家缓过神来，又丢了个 "王炸" ------Tsdown！

咱不禁想问，Rolldown 还在那"半途而废"呢，这 Tsdown 又是哪路神仙？莫慌，咱这就来一探究竟！

Tsdown 是个啥玩意儿？

简单来说，Tsdown 就是个专为 TypeScript 项目打造的 "极速打包神器" ，它背后靠的是 Rolldown 这个"硬核引擎"。

这玩意儿厉害就厉害在，它不仅能像火箭一样飞快地把项目打包了，还能顺手给咱生成 .d.ts 类型声明文件，简直是 TypeScript 开发者的"贴心小棉袄"！

它到底牛在哪？

极速构建，快到飞起！

Tsdown 凭借 Rolldown 和 Oxc 这两个"秘密武器"，把打包速度直接拉满了。

和那些老古董工具比起来，它快了 10-30 倍！这就好比别人还在那骑自行车，Tsdown 已经开着超跑绝尘而去了。

TypeScript 优化，开箱即用！

对于咱这些天天和 TypeScript 打交道的开发者来说，Tsdown 简直就是"救星"。

它内置了 unplugin-isolated-decl，能自动给咱生成 .d.ts 文件，这可比手动去写要省心多了。

插件生态丰富，兼容性拉满！

Tsdown 这家伙特别"合群"，Rollup、Vite、unplugin 这些插件它都能玩得转，而且还能直接复用 Vite 或 Vitest 的配置。

和其他工具比，它能打吗？

咱来简单对比一下：

esbuild：虽然快，但插件生态不够"给力"，Tsdown 在这点上就胜出不少。
Rollup：插件系统是强，但速度太慢了，Tsdown 这边速度和生态"两手抓，两手都要硬"。
Tsup：适合小项目快速迭代，但一到大项目就"力不从心"了，Tsdown 则是"大场面先生"。

适用场景和最佳实践

前端项目打包：要是你在搞个用 TypeScript 写的中大型前端项目，Tsdown 能让你的构建效率"飞起来"。
库构建：开源库或者框架的开发者有福了，Tsdown 能帮你轻松搞定类型定义和多格式打包。
工具链集成：和 Vite、Vitest 一起用，那感觉就是一个字------"爽"！

如何使用？

咱就说，Tsdown 的使用方法简单到让人怀疑是不是漏掉了什么步骤。

咱直接上干货，手把手教你玩转这个 "打包神器" ！

第一步：安装

先别慌，确保你的电脑里已经装了 Node.js （这玩意儿是运行 Tsdown 的基础）。装好了？那咱就开始吧！

打开终端，输入下面这行命令，Tsdown 就能"搬回家"了：

复制代码

npm install tsdown

第二步：配置

Tsdown 需要一个"地图"来知道从哪里开始打包，这个"地图"就是 tsdown.config.ts 文件。

咱在项目根目录下创建一个这个文件，然后写上几行代码：

arduino 复制代码

import { defineConfig } from 'tsdown';

export default defineConfig({
  entry: ['./src'], // 告诉 Tsdown 从哪个文件夹开始打包
  outDir: './dist', // 打包后的文件放哪
  format: ['es', 'cjs'], // 输出格式，ES 模块和 CommonJS 都要
});

第三步：运行

万事俱备，只差东风了！回到终端，输入下面这行命令，Tsdown 就开始干活了：

复制代码

npx tsdown

第四步：迁移（可选）

如果你之前用的是 tsup ，Tsdown 还提供了一个"搬家助手"，帮你把旧项目无缝迁移到 Tsdown 上。

只需要运行：

复制代码

npx tsdown migrate

总结

Tsdown 的使用方法简单到让人怀疑是不是在做梦！

安装、配置、运行，三步就能搞定一个项目的打包。

而且它还支持迁移，对老项目特别友好。要是你还在用那些"老古董"打包工具，不妨试试 Tsdown，说不定用一次就离不开了！

Tsdown 官方文档 ：https://jsr.io/@sxzz/tsdown/doc
Tsdown Github 地址 ：https://github.com/rolldown/tsdown