tsc 编译器与命令行

tsc 是什么

tsc 是 TypeScript 官方的命令行编译器。它的核心工作只有两件事：

1. 检查类型——扫描你的代码，找出类型不匹配的地方
2. 编译产出——把 .ts 文件翻译成 .js 文件

上一章你已经用过最基础的用法：npx tsc hello.ts。但那只是冰山一角。

最基本的使用方式

tsc 有四种典型的调用方式：

# 1. 编译指定文件（此时不会读 tsconfig.json）
npx tsc hello.ts

# 2. 编译当前项目（自动向上查找最近的 tsconfig.json）
npx tsc

# 3. 编译指定目录下所有 .ts 文件
npx tsc src/*.ts

# 4. 用指定的 tsconfig 编译
npx tsc --project tsconfig.production.json

这四种方式里，最常用的是第 2 种和第 4 种。指定文件（第 1 种和第 3 种）只在快速测试时用。

控制输入和输出

—outDir：指定输出目录

默认情况下，.js 文件会生成在 .ts 文件的同一目录下。这在正经项目里很乱——源文件和编译产物混在一起。

--outDir 可以指定一个独立的输出目录：

npx tsc --outDir ./dist

这样，src/index.ts 编译出来的 JS 会放在 dist/src/index.js——目录结构原样保留，但根目录换成了 dist。

—target：控制 JS 版本

--target 决定编译出来的 JavaScript 兼容哪个 ES 版本：

# 编译成 ES2022 语法
npx tsc --target ES2022

# 编译成 ES2015 语法（TypeScript 7.0 支持的最低 target）
npx tsc --target ES2015

不同 target 的产物会有明显差异。比如同样是 const 和箭头函数：

// 源码
const greet = (name: string) => `Hello, ${name}`;

• --target ES2015：保留 const 和箭头函数（ES2015 原生支持）
• TypeScript 7.0 不再支持 es5 作为 target——如果你用旧项目的配置写了 "target": "es5"，tsc 会直接报错。

—module：选择模块格式

--module 控制编译产物使用哪种模块系统：

# ESNext 模块（import/export 原样保留）
npx tsc --module esnext

# CommonJS 模块（require/module.exports）
npx tsc --module commonjs

# Node16 风格
npx tsc --module node16

TypeScript 7.0 的默认值是 esnext。这在现代 Node.js 和前端打包工具（Vite、Webpack）环境下是最佳选择。

三个实用的开关

—watch：监视模式

修改源码后自动重新编译，不用手动跑命令：

npx tsc --watch

终端会持续运行，每次你保存 .ts 文件，tsc 就会自动重新编译并报告错误。前端开发中这个开关几乎必开。

—noEmit：只检查不产出

有时候你只想知道代码有没有类型错误，并不需要生成 JS 文件（比如用 Babel 或 esbuild 做实际编译的场景）：

npx tsc --noEmit

这个命令跑完不会有任何文件被创建或修改。它只是把类型错误报告给你，零副作用。

很多项目把 --noEmit 作为 CI/CD 流水线中的一个检验步骤——只要类型不通过，构建直接失败。

—strict：严格模式

第 6 章会详细展开，现在先知道它的存在：

npx tsc --strict

TypeScript 7.0 默认 strict: true，所以新建项目不需要特别指定。但如果你在接手一个旧项目，strict 可能是关着的。

—project：指定配置文件

你的项目可能有不止一个 tsconfig.json——比如开发环境一套、生产环境一套：

# 指定目录（该目录下的 tsconfig.json）
npx tsc -p ./packages/core

# 指定具体文件
npx tsc -p tsconfig.build.json

-p 是 --project 的缩写，两种写法等价。

—init：一键初始化

从零开始的项目，用这个命令生成基础 tsconfig.json：

npx tsc --init

TypeScript 7.0 生成的默认配置会自动包含：

{
  "compilerOptions": {
    "target": "ES2023",
    "module": "esnext",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

比旧版简洁了不少。因为 strict 已经默认开启了，你不再需要手动列一堆 strict 子项。

查看版本和帮助

两个小但实用的命令：

npx tsc -v         # 查看当前 TypeScript 版本
npx tsc --help     # 查看所有命令行选项
npx tsc --all      # 查看所有编译器选项（非常详细）

小结

tsc 的命令行选项远不止这些，但上面这些是你日常最常用的。简单总结一下你的工具箱：

选项	作用
--outDir ./dist	输出到指定目录
--target ES2022	控制 JS 版本
--module esnext	控制模块格式
--watch	自动监视重新编译
--noEmit	只检查类型，不产出文件
--strict	严格检查
-p tsconfig.json	指定配置文件
--init	生成默认配置

不过说实话，实际项目中很少手动敲这么多命令行参数。配置都写在 tsconfig.json 里——这正是第 5 章要讲的内容。