你不知道的 tsx:让 TypeScript 飞起来的秘密武器!

1,722 阅读3分钟

tsx(TypeScript Execute) 是一个用于在 Node.js 环境中直接运行 TypeScript 文件的工具。它基于 esbuild 构建,提供快速的 TypeScript 编译和执行能力,并支持现代模块系统。

核心特性

  • 快速执行:利用 esbuild 的高性能,实现 TypeScript 代码的即时编译和执行。
  • 模块兼容性:支持 CommonJS(CJS)和 ECMAScript Modules(ESM)的无缝互操作,解决模块类型不匹配的问题。
  • 零配置:无需额外配置,即可直接运行 TypeScript 文件,简化开发流程。
  • 监视模式:内置 Watch 模式,自动监视文件变化并重新运行代码,提高开发效率。

安装与使用

环境要求

确保已安装 Node.js >= 18

快速开始

无需安装即可使用 npx 运行 TypeScript 文件:

npx tsx ./script.ts

项目中安装

tsx 安装为开发依赖:

# 使用 npm
npm install -D tsx

# 使用 pnpm
pnpm add -D tsx

# 使用 yarn
yarn add -D tsx

安装后,可在项目中通过以下方式运行 TypeScript 文件:

# 使用 npx
npx tsx ./file.ts

# 使用 pnpm
pnpm tsx ./file.ts

# 使用 yarn
yarn tsx ./file.ts

package.json 中添加脚本:

{
  "scripts": {
    "start": "tsx ./file.ts"
  }
}

全局安装

如需全局使用 tsx,可运行:

# 使用 npm
npm install -g tsx

# 使用 pnpm
pnpm add -g tsx

全局安装后,可直接运行:

tsx ./file.ts

监视模式

tsx 提供内置的 Watch 模式,可在文件变化时自动重新运行脚本:

tsx watch ./file.ts

默认行为

默认情况下,tsx 会监视所有被导入的文件,但以下目录除外:

  • node_modules
  • bower_components
  • vendor
  • dist
  • 隐藏目录(以 . 开头)

自定义监视

可使用 --include--exclude 选项自定义监视的文件或目录:

# 包含特定文件或目录
tsx watch --include ./other-dep.txt --include "./other-deps/*" ./file.ts

# 排除特定文件或目录
tsx watch --exclude ./ignore-me.js --exclude ./ignore-me-too.js ./file.ts

支持使用 glob 模式,需用引号包裹以防止 shell 展开:

tsx watch --exclude "./data/**/*" ./file.ts

tsx 与 ts-node 的对比

tsxts-node 都是用于在 Node.js 环境中直接运行 TypeScript 文件的工具,但它们在性能、模块支持和使用体验上存在差异。

性能

tsx 基于 esbuild 构建,编译速度更快,适合需要高效开发的场景。而 ts-node 使用 TypeScript 自身的编译器,编译速度相对较慢,但提供更严格的类型检查。

模块支持

tsx 对 ESM 和 CJS 模块提供更好的兼容性,能够无缝处理两者之间的导入和导出,避免常见的模块类型错误。而 ts-node 在处理 ESM 模块时可能需要额外配置,使用上相对复杂。

使用体验

tsx 提供内置的 Watch 模式,无需额外工具即可实现文件变更的自动重载,提升开发效率。而 ts-node 需要配合其他工具(如 nodemon)实现类似功能。

选择建议

  • 开发效率:如果追求更快的编译速度和简化的配置,tsx 是更好的选择。
  • 类型检查:如果需要严格的类型检查,ts-node 提供更全面的支持。
  • 模块兼容性:如果项目中同时使用 ESM 和 CJS 模块,tsx 的兼容性更优。

结论

tsx 是一个高效、易用的 TypeScript 执行工具,通过快速的编译、良好的模块兼容性和内置的监视模式,提升了开发者在 Node.js 环境中使用 TypeScript 的体验。与 ts-node 相比,tsx 在性能和使用便捷性方面具有优势。