如何在TypeScript多项目场景下使用watch标志？

你的场景下，TypeScript从3.0版本开始就提供了**项目引用（Project References）**这个内置方案，完全可以替代concurrently实现多项目的watch监听，无需额外工具。

配置步骤 #

1. 修改主tsconfig.json
   开启composite模式，并通过references字段声明所有子项目：

   {
     "compilerOptions": {
       "composite": true,
       // 保留你原有的主配置项
     },
     "references": [
       { "path": "./src/compactor" },
       { "path": "./src/generator" },
       { "path": "./src/cleaner" }
     ]
   }
   

2. 调整子项目的tsconfig.json
   每个子项目的配置文件需要开启composite: true，同时确保继承主配置：

   // src/compactor/tsconfig.json 示例
   {
     "extends": "../../tsconfig.json",
     "compilerOptions": {
       "composite": true,
       "outDir": "../../dist-compactor" // 和你build脚本里的输出目录保持一致
       // 子项目的个性化配置
     },
     "include": ["**/*"]
   }
   

3. 更新package.json的watch脚本
   直接使用TypeScript内置的命令：

   "watch": "tsc -b -w"
   

   其中-b是--build参数，用于项目引用模式下的构建；-w是--watch参数，开启监听模式。

优势对比 #

• 统一管理编译状态：TypeScript会统筹所有子项目的编译，避免多个独立进程的资源浪费
• 增量编译优化：只会重新编译变更的文件，监听效率更高
• 依赖关系自动处理：如果子项目之间存在依赖，会按正确顺序编译（无依赖时也能并行编译）

内容的提问来源于stack exchange，提问作者ablaszkiewicz1