如何为TypeScript项目不同模块配置不同的ES编译目标

默认情况下compilerOptions确实对整个项目生效，但单个tsconfig.json完全可以实现你的需求，无需拆分多个配置文件，使用TS原生的overrides配置项即可对不同路径的文件应用差异化的编译规则。

实现步骤 #

前置目录约定 #

假设你的两类代码已经按目录拆分，结构如下：

.
├── src
│   ├── internal  # 内部业务模块，需要最新ES特性支持
│   └── external  # 对外输出模块，需要高向下兼容性
└── tsconfig.json

单tsconfig.json配置示例 #

{
  // 全局通用公共配置，两类模块默认继承
  "compilerOptions": {
    "strict": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "declaration": true,
    "rootDir": "./src"
  },
  "include": ["src/**/*"],
  // 核心：针对不同路径覆盖编译配置
  "overrides": [
    {
      // 匹配所有对外模块的文件
      "files": ["src/external/**/*.ts", "src/external/**/*.js"],
      "compilerOptions": {
        "target": "ES5", // 可根据兼容需求调整为ES2015等版本
        "module": "UMD", // 兼容CommonJS、AMD等多种模块规范
        "outDir": "./dist/external",
        "downlevelIteration": true, // 降级ES6+迭代器语法
        "importHelpers": true // 复用TS辅助函数减小产物体积
      }
    },
    {
      // 匹配所有内部业务模块的文件
      "files": ["src/internal/**/*.ts", "src/internal/**/*.js"],
      "compilerOptions": {
        "target": "ESNext", // 支持最新ES特性
        "module": "ESNext",
        "outDir": "./dist/internal",
        "useDefineForClassFields": true // 原生ES类字段特性支持
      }
    }
  ]
}

编译使用 #

直接执行tsc命令即可，TS会自动根据文件路径匹配对应的编译规则，无需额外参数。

可选：复杂场景的项目引用方案 #

如果两类模块的依赖、类型定义差异极大，也可以使用TS的项目引用功能拆分配置，方便独立维护：

• 分别在src/internal、src/external目录下新增独立的tsconfig.json，编写对应模块的专属配置
• 根目录tsconfig.json配置references关联两个子项目：

{
  "files": [],
  "references": [
    { "path": "./src/internal" },
    { "path": "./src/external" }
  ]
}

• 执行tsc --build即可批量编译所有子项目。

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