前端开发中，TypeScript 已经成为越来越多人的首选。写代码时，每次改完 .ts 文件都要手动执行 tsc 命令，等编译完成才能看效果，效率低还容易打断思路。其实，完全可以让 TypeScript 在你保存文件时自动重新编译，省去重复操作。
用 tsc --watch 实现监听
TypeScript 自带的编译器 tsc 提供了 --watch 模式，能监听文件变化并自动编译。只要在项目根目录执行下面命令：
tsc --watch一旦你修改并保存了任何一个 .ts 文件，TypeScript 编译器就会立刻检测到变动，重新生成对应的 .js 文件。这个功能不需要额外安装工具，开箱即用。
配合 tsconfig.json 使用更顺手
大多数 TypeScript 项目都有 tsconfig.json 文件。只要配置好入口和输出目录，--watch 就能精准工作。比如你的配置长这样：
{
"compilerOptions": {
"target": "ES2016",
"module": "commonjs",
"outDir": "./dist",
"rootDir": "./src",
"strict": true
},
"include": ["src/**/*"]
}然后在终端运行 tsc --watch，它就会盯着 src 目录下的所有 .ts 文件，一有保存动作，马上编译到 dist 目录。
结合 nodemon 提升开发体验
如果你在写 Node.js 后端服务，光编译还不够，还得重启服务。这时候可以搭配 nodemon 使用。先安装：
npm install -g nodemon然后创建一个启动脚本，比如在 package.json 里加一条：
"scripts": {
"dev": "nodemon dist/index.js"
}再开两个终端：一个跑 tsc --watch，另一个运行 npm run dev。这样从改代码到看到结果，全程自动化。
一步到位：使用 concurrently 简化流程
同时开多个命令行窗口太占地方，可以用 concurrently 把它们合并成一条命令：
npm install -g concurrently
# 然后在 scripts 中添加
"dev": "concurrently \"tsc --watch\" \"nodemon dist/index.js\""现在只需要输入 npm run dev，TypeScript 自动编译 + Node 服务自动重启全搞定。
这种自动编译的工作流，就像保存文档时自动存盘一样自然。刚开始可能觉得多配了几行命令，但用上几天后你会发现，再也回不去手动编译的日子了。