TSConfig 配置（tsconfig.json)

详细总结一下 TSConfig 的相关配置项。个人笔记，仅供参考，欢迎批评指正！

另外，如果想了解更多 ts 相关知识，可以参考我的其他笔记：

• vue3+ts 开发干货笔记
• ts 相关笔记（基础必看）
• ts 相关笔记（Partial、Required、Readonly、Record、Exclude、Extract）
• ts 相关笔记（类型层级）
• ts 相关笔记（extends、infer、Pick、Omit）

根目录

{
  
   "files": [], 
  "include": [], 
  "exclude": [], 
  
  "extends": "",
  
  "compilerOptions": {},
  
  "references": [],
  
  "compileOnSave": true
}

指定编译文件 / 目录

files、include 与 exclude

这三个选项决定了将被包括到本次编译的代码文件。
使用 files 我们可以描述本次包含的所有文件，但不能使用 src 或者 src/* 这种方式，每个值都需要是完整的文件路径，适合在小型项目时使用。
我们常用 include 和 exclude 进行配置，配置方式参考

{
  "include": ["src/**/*", "generated/*.ts", "internal/*"],
  "exclude": ["src/file-excluded", "/**/*.test.ts", "/**/*.e2e.ts"]
}

• src/**/* 表示匹配 src 下所有的合法文件，而无视目录层级
• internal/* 则只会匹配 internal 下的文件，不会匹配 internal/utils/ 下的文件
• 在不包括文件扩展名（*.ts）的情况下只会匹配 .ts / .tsx / .d.ts / .js / .jsx 文件（js 和 jsx 文件需要启用 allowJs 配置时才会被包括）

extends— 配置继承

用 extends 属性从另一个配置文件里继承配置（覆盖当前），值是一个文件路径的字符串。
在原文件里的配置先被加载，然后被来自继承文件里的配置重写。如果发现循环引用，则会报错。

来自所继承配置文件的 files，include 和 exclude 覆盖源配置文件的属性。

比如：

{
  "compilerOptions": {
    "noImplicitAny": true,
    "strictNullChecks": true
  }
}

{
  "extends": "./configs/base",
  "files": [
    "main.ts",
    "supplemental.ts"
  ]
}

{
  "extends": "./tsconfig",
  "compilerOptions": {
    "strictNullChecks": false
  }
}

在最顶层设置 compileOnSave 标记，可以让 IDE 在保存文件的时候根据 tsconfig.json 重新生成文件，这个配置需要编译器支持。

！！！请注意，它（目前）并没有得到 Visual Studio Code 的支持 。仅在 Visual Studio 2015 和安装了 atom-typescript 插件的 Atom 中得到了支持。而该插件和 Atom 均已 停止维护

如下 👇

{
    "compileOnSave": true,
    "compilerOptions": {
        "noImplicitAny" : true
    }
}

references—工程引用

TypeScript 3.0 的新特性，它支持将 TypeScript 程序的结构分割成更小的组成部分。
这样可以改善构建时间，强制在逻辑上对组件进行分离，更好地组织你的代码。

可以参考一下 element-plus 的应用

{
  "files": [],
  "references": [
    { "path": "./tsconfig.web.json" },
    { "path": "./tsconfig.play.json" },
    { "path": "./tsconfig.node.json" },
    { "path": "./tsconfig.vite-config.json" },
    { "path": "./tsconfig.vitest.json" }
  ]
}

compilerOptions—编译配置选项

可参考 typescript 中文网

• [1] 这些选项是试验性的。
• [2] 这些选项只能在 tsconfig.json里使用，不能在命令行使用。