配置文件

一个大型项目中通常具有成百上千个待编译的 .ts 文件,而一次编译会涉及较多的编译选项,如果只通过命令行的形式逐个输入文件及编译选项,命令的编写将非常复杂。

为了提高编译命令的可复用性及可维护性,TypeScript 支持通过配置文件设置待编译文件及编译选项。配置文件的固定名称为 tsconfig.json,该文件通常位于 TypeScript 项目的根目录下,用于对整个目录的编译完成整体的配置。

tsconfig.json 文件能够完成的配置类型如下。

  • 文件列表。

  • 编译选项。

  • 项目引用。

  • 配置继承。

下面介绍如何创建 tsconfig.json 配置文件,以及每种配置类型的作用。

tsconfig.json文件的创建及匹配规则

要创建 tsconfig.js 文件,只需要在指定目录下执行以下命令即可。

$ tsc --init

之后将会在该目录下生成 tsconfig.js 文件,默认内容如下。

{
  "compilerOptions": {
        "target": "es2016",
        /*等同于编译命令中的target,指定要输出的JavaScript版本*/
        "module": "commonjs",
        /*指定将涉及模块的代码转换成哪种模块规范下的代码*/
        "esModuleInterop": true,
        /*兼容性选项,允许从没有设置过默认导出的模块中默认导入,仅为了通过类型检查*/
        "forceConsistentCasingInFileNames": true,
        /*涉及模块导入时,文件名中的大小写都需要匹配*/
        "strict": true,
        /*启用严格的类型检查选项*/
        "skipLibCheck": true
        /*忽略所有以".d.ts"为后缀的文件的编译检查*/
  }
}

如果一个目录下存在 tsconfig.json 文件,通常意味着这个目录是 TypeScript 项目的根目录。在不带任何输入文件的情况下执行 tsc 命令,编译器会从当前目录开始查找 tsconfig.js 文件,如果当前目录中不存在该文件,则会逐级向上查找。找到文件后,会使用其编译设置,并编译文件所在目录及其子目录下的所有文件。

假设 D:\TSProject 的结构如下。

D:\TSProject
│  a.ts
│  tsconfig.json
│
├─folder1
│      b.ts
│
└─folder2
        c.ts
        tsconfig.json

在不同的目录下执行 tsc 命令,效果分别如下。

  • D:\TSProject 目录下执行 tsc 命令,将会同时编译该目录及其子目录下的所有 TypeScript 文件(D:\TSProject\a.ts、D:\TSProject\folder1\b.ts、D:\TSProject\folder2\c.ts),编译设置将使用 D:\TSProject\tsconfig.json 文件中的设置,然后输出 D:\TSProject\a.js、D:\TSProject\ folder1\b.js、D:\TSProject\folder2\c.js。

  • 在 D:\TSProject\folder1 目录下执行 tsc 命令,由于该目录下没有 tsconfig.json 文件,因此会逐级向上层目录查找,由于上层目录 D:\TSProject 中具有 tsconfig.json 文件,因此将会以 D:\TSProject 为根目录编译文件,编译效果等同于在 D:\TSProject 目录下执行 tsc 命令。

  • 在 D:\TSProject\folder2 目录下执行 tsc 命令,由于该目录下具有 tsconfig.json 文件,因此会以此目录为根目录进行编译,编译设置将使用 D:\TSProject\folder2\tsconfig.json 文件中的设置,然后只输出 D:\TSProject\folder2\c.js 文件。

执行 tsc 命令时,可以使用 --showConfig 选项,查看本次编译时将使用的配置(但不会真正进行编译),例如,执行 tsc --showConfig 命令,输出结果如下。输出结果列出了所有编译选项和将参与编译的文件。

> {
>     "compilerOptions": {
>         "target": "es2016",
>         "module": "commonjs",
>         "esModuleInterop": true,
>         "forceConsistentCasingInFileNames": true,
>         "strict": true,
>         "skipLibCheck": true
>     },
>     "files": [
>         "./a.ts",
>         "./folder1/b.ts",
>         "./folder2/c.ts"
>     ]
> }

当运行 tsc 命令时,编译器将默认使用当前目录或上层目录中的 tsconfig.json 文件,但你也可以使用 --project 编译选项(缩写选项为 -p)指定配置文件的路径(配置文件全路径或其所在目录路径均可),以该路径所在目录为根目录进行编译,具体命令如下。

$ tsc --project 配置文件路径或其所在目录路径

假设 D:\TSProject 的结构如下。

D:\TSProject
├─project1
│      a.ts
│      tsconfig.json
│      tsconfig.version2.json
│
└─project2
        b.ts
        tsconfig.json

如果在 D:\TSProject 下执行 tsc 命令,由于当前目录及上层目录中不存在配置文件,因此命令执行后将输出帮助文档,而非编译文件。

如果在 D:\TSProject 目录下执行 tsc --project project1 命令,将会以 D:\TSProject\project1\tsconfig.json 的编译选项为准,编译其所在目录下的所有 TypeScript 文件,命令执行后将输出 D:\TSProject\project1\a.js 文件。

如果在 D:\TSProject 目录下执行 tsc --project project2 命令,将会以 D:\TSProject\project21\tsconfig.json 的编译选项为准,编译其所在目录下的所有 TypeScript 文件,命令执行后将输出 D:\TSProject\project1\b.js 文件。

如果在 D:\TSProject 目录下执行 tsc --project project1\tsconfig.version2.json 命令,将会以 D:\TSProject\project1\tsconfig.version2.json 的编译选项为准,编译其所在目录下的所有 TypeScript 文件,命令执行后将输出 D:\TSProject\project1\a.js 文件。

文件列表

如果目录中有 tsconfig.json 文件,在执行 tsc 命令时,默认会将配置文件所在目录及其子目录下的所有 TypeScript 文件(扩展名为 .ts.tsx)添加到编译列表中。通过在 tsconfig.json 文件中配置 filesincludeexclude 选项过滤待编译的 TypeScript 文件。

假设 D:\TSProject 目录的结构如下。

D:\TSProject
├─src
│  │  a.ts
│  │
│  └─subfolder
│          b.ts
│
└─testing
        c.ts

如果直接在 D:\TSProject 目录下执行 tsc 命令,src/a.tssrc/subfolder/b.tstesting/c.ts 文件都会被编译。

files选项

files 选项用于指定要编译的具体文件,这些文件可以使用绝对路径或相对路径来指定。

可以修改 tsconfig.json 文件,使用 files 选项来指定要编译的文件。tsconfig.json 文件的内容如下。

{
  "files":["src/a.ts","src/subfolder/b.ts"],
}

之后再执行 tsc 命令,只有 src/a.tssrc/subfolder/b.ts 文件会被编译,testing/c.ts 文件不会被编译。

由于 files 选项只能用于逐个列举单个文件,因此在项目中并不实用,通常更常用的是 includeexclude 选项。

include/exclude选项

include/exclude 选项用于指定要编译/排除的文件列表或目录列表。除指定具体文件路径或目录路径之外,还可以使用以下通配符匹配多个文件。

  • *:表示文件名或路径匹配任意数量字符(不包含分隔符)。

  • ?:表示文件名或路径匹配任意一个字符(不包含分隔符)。

  • **/:表示匹配当前目录及所有子目录。

例如,要编译 src 目录下的文件,忽略 testing 目录下的文件,tsconfig.json 文件代码可修改为如下内容。

{
  "include": ["src"]
}

之后再执行 tsc 命令,src 目录及其子目录下的所有文件( src/a.tssrc/subfolder/b.ts )都会被编译。

假设需要编译 src 目录下的文件,但不编译 src/subfolder 目录下的文件,tsconfig.json 文件可修改为如下内容。

{
  "include": ["src"],
  "exclude": ["src/subfolder"]
}

之后再执行 tsc 命令,除 src/subfolder 目录之外,src 目录及其子目录下的所有文件都会被编译,本例中最终被编译的文件有 src/a.ts

编译选项

tsconfig.json 配置文件中的 compilerOptions 选项用于指定详细的编译选项,这些编译选项和 tsc 命令中使用的编译选项完全相同。相比在 tsc 命令中使用编译选项,在配置文件中使用这些编译选项将具有更好的可复用性和可维护性。

由于编译选项众多,因此这里不一一详述。下面仅列出常用的编译选项及简要说明。

{
  "compilerOptions": {
    /*访问 https://aka.ms/tsconfig.json 可查看完整的编译选项*/

    /*基础选项*/
    "target": "es5"
    /*target用于指定编译后.js文件遵循的目标版本——'ES3' (default), 'ES5', 'ES2015', 'ES2016',
    'ES2017', 'ES2018', 'ES2019'或'ESNEXT'*/
    "module": "commonjs"
    /*用来指定编译后的.js文件所使用的模块标准——'none', 'commonjs', 'amd', 'system', 'umd',
    'es2015'或'ESNext'.*/
    "lib": ["es6", "dom"]
    /*lib用于指定要包含在编译中的库文件*/
    "allowJs": true,
    /*allowJs设置的值为true或false,用来指定是否允许编译.js文件,默认是false,即不编译.js
    文件*/
    "checkJs": true,
    /*checkJs的值为true或false,用来指定是否检查和报告.js文件中的错误,默认是false*/
    "jsx": "preserve",
    /*指定jsx代码用于的开发环境——'preserve', 'react-native'或'react'.*/
    "declaration": true,
    /*declaration的值为true或false,用来指定是否在编译的时候生成相应的".d.ts"声明文件。如果
    设为true,编译每个.ts文件后会生成一个.js文件和一个声明文件。但是declaration和allowJs不
    能同时设为true*/
    "declarationMap": true,
    /* declarationMap的值为true或false,指定是否为声明文件.d.ts生成.map文件*/
    "sourceMap": true,
    /*sourceMap的值为true或false,用来指定编译时是否生成.map文件*/
    "outFile": "./",
    /*outFile用于指定将输出文件合并为一个文件,它的值为一个文件路径名。例如,若设置为"./dist/
    main.js",则输出的文件为一个main.js文件。但是要注意,只有设置module的值为amd模块和system
    模块时才支持这个配置*/
    "outDir": "./",
    /*outDir用来指定输出文件夹,它的值为一个文件夹路径字符串,输出的文件都将放置在这个文件夹中*/
    "rootDir": "./",
    /*用来指定编译文件的根目录,编译器会在根目录中查找入口文件*/
    "composite": true,
    /*是否生成.tsbuildinfo文件,以此判断是否启用增量编译,tsconfig.tsbuildinfo文件存储了本
    次编译时各个文件的版本(文件MD5)信息,当下次再进行编译时,将用于判断是否需要重新编译各个文件*/
    "incremental": true,
    /*启用增量编译*/
    "tsBuildInfoFile": "./",
    /*指定用于存储增量编译信息的文件,从而可以更快地构建规模更大的TypeScript项目*/
    "removeComments": true,
    /*removeComments的值为true或false,用于指定是否将编译后的文件中的注释删掉,若设为true,
    删掉注释,默认为false*/
    "noEmit": true,
    /*不生成编译文件,仅进行编译检查*/
    "importHelpers": true,
    /*importHelpers的值为true或false,指定是否引入tslib里的辅助工具函数,默认为false*/
    "downlevelIteration": true,
    /*当target为'ES5'或'ES3'时,为'for-of'、spread和destructuring中的迭代器提供完全支持*/
    "isolatedModules": true,
    /*isolatedModules的值为true或false,指定是否将每个文件作为单独的模块,默认为true,它不
    可以和declaration同时设定*/
    /*严格类型检查选项*/
    "strict": true
    /*strict的值为true或false,用于指定是否启动所有类型检查,如果设为true,则会同时开启下面这
    几个严格类型检查,默认为false*/,
    "noImplicitAny": true,
    /*noImplicitAny的值为true或false,如果没有为一些值设置明确的类型,编译器会默认为any,如
    果noImplicitAny的值为true,则没有明确的类型会报错,默认为false*/
    "strictNullChecks": true,
    /*strictNullChecks为true时,null和undefined不能赋给非这两种类型的变量,别的类型也不能
    赋给它们,除any类型之外。还有个例外是undefined可以赋给void类型*/
    "strictFunctionTypes": true,
    /*strictFunctionTypes的值为true或false,用于指定是否使用函数参数双向协变检查*/
    "strictBindCallApply": true,
    /*设为true后,对bind、call和apply绑定的方法的参数的检测是严格的*/
    "strictPropertyInitialization": true,
    /*设为true后会检查类的非undefined属性是否已经在构造函数里初始化,如果要开启该选项,需要同
    时开启strictNullChecks,默认为false*/
    "noImplicitThis": true,
    /*当this表达式的值为any类型的时候,生成一个错误*/
    "alwaysStrict": true,
    /*alwaysStrict的值为true或false,指定始终以严格模式检查每个模块,并且在编译之后的.js文
    件中加入"use strict"字符串,用来告诉浏览器该js为严格模式*/

    /*额外检查*/
    "noUnusedLocals": true,
    /*用于检查是否有定义了但是没有使用的变量,对于这一点的检测,eslint可以在书写代码的时候做提示,
    可以配合使用。默认为false*/
    "noUnusedParameters": true,
    /*用于检查在函数体中是否有没有使用的参数,也可以配合eslint来做检查,默认为false*/
    "noImplicitReturns": true,
    /*用于检查函数是否有返回值,设为true后,如果函数没有返回值,则会提示,默认为false*/
    "noFallthroughCasesInSwitch": true,
    /*用于检查switch中是否有case没有使用break跳出,默认为false*/

    /*模块相关选项*/
    "moduleResolution": "node",
    /*用于选择模块解析策略,有"node"和"classic"两种类型*/
    "baseUrl": "./",
    /*baseUrl用于设置解析非相对模块名称的基本目录,相对模块的目录不会受baseUrl的影响*/
    "paths": {},
    /*用于设置模块名称到基于baseUrl的路径映射*/
    "rootDirs": [],
    /*rootDirs可以指定一个路径列表,在构建时编译器时会将这个路径列表中的路径的内容都放到一个文件
    夹中*/
    "typeRoots": [],
    /*typeRoots用来指定声明文件或文件夹的路径列表,如果指定了此项,则只有在这里列出的声明文件才
    会被加载*/
    "types": [],
    /*types用来指定需要包含的模块,只有在这里列出的模块的声明文件才会被加载*/
    "allowSyntheticDefaultImports": true,
    /*用来指定允许从没有默认导出的模块中默认导入*/
    "esModuleInterop": true
    /*通过为导入内容创建命名空间,实现CommonJS和ES模块之间的互操作*/,
    "preserveSymlinks": true,
    /*不把符号链接解析为真实路径,具体可以了解Webpack和Node.js的SymLink*/

    /*源文件映射选项*/
    "sourceRoot": "",
    /*sourceRoot用于指定调试器应该找到TypeScript文件而不是源文件位置,它会被写进.map文件里*/
    "mapRoot": "",
    /*mapRoot用于指定调试器找到映射文件而非生成文件的位置,指定.map文件的根路径,该选项会影
    响.map文件中的sources属性*/
    "inlineSourceMap": true,
    /*指定是否将.map文件的内容和.js文件编译在同一个.js文件中,如果设为true,则map的内容会以
    "//# sourceMappingURL="开头并且拼接base64字符串的形式插入在.js文件底部*/
    "inlineSources": true,
    /*用于指定是否进一步将.ts文件的内容也包含到输入文件中*/

    /*实验性选项*/
    "experimentalDecorators": true
    /*用于指定是否启用实验性的装饰器特性*/
    "emitDecoratorMetadata": true,
    /*用于指定是否为装饰器提供元数据支持,元数据也是ES6的新标准,可以通过Reflect提供的静态方法
    获取,如果需要使用Reflect的方法,则需要引入ES2015.Reflect这个库*/
  }
}

项目引用

在大型项目中,代码文件的数量通常成百上千,若都将其作为一个项目进行管理,不仅代码维护极其困难,且编译时性能较差。通常的做法是将其划分为多个独立的子项目,每个项目都在不同的目录下进行维护,并拥有独立的编译配置。

这些子项目之间存在互相引用的关系,通过设置它们之间的引用关系,你就可以将其组织起来并形成一个完整的项目。

tsconfig.json 文件中可以通过配置 references 选项,指定当前项目所引用的子项目。

references选项及子项目编译选项

references 选项的配置方式如下。其中引用的项目目录可以是文件夹路径,也可以是 tsconfig.json 文件路径。

{
  …
  "references": [{ "path": "引用的工程目录1" },{ "path": "引用的工程目录2" }…]
}

除此以外,在被引用的项目中,tsconfig.json 文件的 composite 编译选项必须设置为 true 才能被其他项目引用(composite 选项可以强制执行某些约束,使构建编译器能够快速确定项目是否已经编译,避免重复编译),代码如下。

{
  …
  "compilerOptions": {
    "composite": true
  }
}

项目引用示例

假设一个项目中有底层框架子项目,业务子项目和测试子项目,业务项目引用了底层框架,而测试项目引用了业务项目,它们之间的引用关系如图18-2所示。

image 2024 02 20 10 12 53 393
Figure 1. 图18-2 项目之间的引用关系

假设此项目结构如下。

D:/TSProject
├─framework
│      base.ts
├─src
│      product.ts
└─testing
        product.test.ts

要设置它们之间的依赖关系,首先需要在 frameworksrctesting 目录中各创建一个 tsconfig.json 文件,目录结构如下所示。

D:/TSProject
├─framework
│      base.ts
│      tsconfig.json
├─src
│      product.ts
│      tsconfig.json
└─testing
        product.test.ts
        tsconfig.json

framework/tsconfig.json 文件的内容如下。由于此项目将被 src 项目引用,因此必须将 composite 选项设置为 true。该项目本身没有引用其他项目。

{
  "compilerOptions": {
    "composite": true
  }
}

src/tsconfig.json 文件的内容如下。此项目既引用了 framework 项目,又被其他项目引用,因此既设置了 composite 选项,又设置了 references 选项。

{
  "compilerOptions": {
    "composite": true
  },
  "references": [{ "path": "../framework" }]
}

testing/tsconfig.json 文件的内容如下。此项目引用了 src 项目,但未被其他项目引用,因此只设置了 references 选项。

{
  "references": [{ "path": "../src" }]
}

编译项目

当设置好项目引用后,使用 --build 选项(缩写选项 -b)来编译指定项目。编译时会自动检查该项目所引用的项目。若所引用的项目尚未编译或有文件更新,则根据引用顺序全量或增量编译这些项目,最后再编译当前项目。

在之前创建了 frameworksrctesting 3个项目,下面使用以下命令编译 src 项目(--verbose 选项用于输出详细的日志),代码如下。

$ tsc --build src --verbose

输出结果如下。可以看到编译目标为 src 项目,但实际参与编译的有 frameworksrc 项目,编译器检测到这两个项目都尚未编译,因此按照引用顺序,先编译 framework 项目,然后编译 src 项目。

> [下午7:02:01] Projects in this build:
    * framework/tsconfig.json
    * src/tsconfig.json

> [下午7:02:01] Project 'framework/tsconfig.json' is out of date because output
  file 'framework/base.js' does not exist

> [下午7:02:01] Building project 'D:/TSProject/framework/tsconfig.json'...

> [下午7:02:03] Project 'src/tsconfig.json' is out of date because output file
  'src/product.js' does not exist

> [下午7:02:03] Building project 'D:/TSProject/src/tsconfig.json'...

下面使用以下命令编译 testing 项目。

$ tsc --build testing --verbose

输出结果如下。可以看到编译目标为 testing 项目,但实际参与编译的有 frameworksrctesting 这 3 个项目,编译器会按照引用顺序依次检测各个项目,由于检测到 frameworksrc 项目已经编译,因此本次只编译了 testing 项目。

> [下午7:00:45] Projects in this build:
    * framework/tsconfig.json
    * src/tsconfig.json
    * testing/tsconfig.json

> [下午7:00:45] Project 'framework/tsconfig.json' is up to date because newest input
  'framework/base.ts' is older than oldest output 'framework/base.js'

> [下午7:00:45] Project 'src/tsconfig.json' is up to date because newest input
  'src/product.ts' is older than oldest output 'src/product.js'

> [下午7:00:45] Project 'testing/tsconfig.json' is out of date because output file
  'testing/product.test.js' does not exist

> [下午7:00:45] Building project 'D:/TSProject/testing/tsconfig.json'...

编译完成后,项目结构如下。

D:/TSProject
├─framework
│      base.d.ts
│      base.js
│      base.ts
│      tsconfig.json
│      tsconfig.tsbuildinfo
│
├─src
│      product.d.ts
│      product.js
│      product.ts
│      tsconfig.json
│      tsconfig.tsbuildinfo
│
└─testing
        product.test.js
        product.test.ts
        tsconfig.json

可以看到,在所有的项目下都输出了对应的 .js 文件,在 frameworksrc 项目中还额外生成了 .d.ts 文件和 tsconfig.tsbuildinfo 文件,这是由于这些项目的 composite 编译选项设置为 true。其中 .d.ts 文件为简化后的声明文件,只保留了关键声明的相关信息(关于声明文件,详见21.1节),上层项目将使用这些简化后的文件进行编译检查,提高检查效率,而不是直接解析 .ts 源文件。tsconfig.tsbuildinfo 文件存储了本次编译中各个文件的版本(文件 MD5)信息,当下次再进行编译时,将用于判断是否需要重新编译各个文件。

tsc --build 命令还支持其他的选项,如下所示。

  • --verbose:输出详细的日志(选项缩写为 -v)。

  • --dry: 显示将要执行的操作但是并不真正进行这些操作(选项缩写为 -d)。

  • --clean: 删除指定项目的输出(选项缩写为 -f)。

  • --force: 强制把所有项目当作非最新版本对待。

这些选项必须配合 --build 选项一同使用。

配置继承

配置文件可以继承另一个配置文件中的配置。一个大型项目通常会划分为多个项目,这些子项目的各项配置可能大同小异,因此你可以将通用的配置提取到一个公共配置文件中,其他配置文件继承该公共文件的配置,以提高配置的可复用性和可维护性。

tsconfig.json 文件中,通过 extends 选项指定当前配置所继承的配置,示例代码如下。

{
  …
  "extends": "配置文件路径"
}

如果配置文件路径开头不是 “./”(当前目录)或 “../”(上一级目录),则继承时编译器会默认从当前目录的 node_modules 目录下查找配置文件。

假设当前项目目录如下。

D:\TSProject
│  tsconfig.json
│
├─base
│      tsconfig.base.json
│
└─src
        a.ts

其中,base/tsconfig.base.json 文件将作为公共配置文件使用,tsconfig.json 文件将继承该文件的配置。

base/tsconfig.base.json 文件的内容如下,编译选项 target 的值为 ESNext

{
    "compilerOptions": {
       "target": "ESNext"
    }
}

tsconfig.json 文件的内容如下,编译选项 module 的值为 CommonJS,而 extends 选项指向 base/tsconfig.base.json 文件,表示从该文件继承配置。

{
  "compilerOptions": {
    "module": "CommonJS"
  },
  "extends": "./base/tsconfig.base.json"
}

接下来,在 D:\TSProject 目录下执行 tsc --showconfig 命令,输出结果如下,可以看到编译时同时应用了 base/tsconfig.base.jsontsconfig.json 文件中的配置。

> {
>     "compilerOptions": {
>         "target": "esnext",
>         "module": "commonjs"
>     },
>     "files": [
>         "./src/a.ts"
>     ]
> }

当在子配置文件与父配置文件中都设置了同一个选项时,子配置文件中的选项值将覆盖父配置文件中的选项值。

例如,将 tsconfig.json 中编译选项 target 设置为 ECMAScript 3(base/tsconfig.base.json 文件中编译选项 target 的值为 ESNext)。

{
  "compilerOptions": {
    "module": "CommonJS",
    "target": "ES3"
  },
  "extends": "./base/tsconfig.base.json"
}

在 D:\TSProject 目录下执行 tsc --showconfig 命令,输出结果如下。可以看到 target 选项使用了子配置文件 tsconfig.json 中的值。

> {
>     "compilerOptions": {
>         "target": "es3",
>         "module": "commonjs"
>     },
>     "files": [
>         "./src/a.ts"
>     ]
> }

注意,如果在父配置文件中设置了 filesincludeexclude 选项,子配置文件在继承这些选项后,将以父配置文件所在目录为基础来查找文件。

例如,对 base/tsconfig.base.json 文件代码进行如下修改,增加 include 选项,让其只编译 src 项目目录下的文件。

{
    "compilerOptions": {
       "target": "ESNext"
    },
    "include": ["src"]
}

在 D:\TSProject 目录下执行 tsc --showconfig 命令,输出结果如下。

> error TS18003: No inputs were found in config file 'D:/TSProject/tsconfig.json'.
Specified 'include' paths were '["base/src"]' and 'exclude' paths were '[]'.

可以看到 tsc 命令虽然是在 D:\TSProject 中执行的,include 选项也设置了 src 目录,但实际上是基于父配置文件所在的 base 目录查找的,查找目标为 base/src 目录。由于该目录不存在,因此会引起编译错误。

再次修改 base/tsconfig.base.json 文件的内容,将 include 选项设置为上一级目录下的 src 目录。

{
    "compilerOptions": {
       "target": "ESNext"
    },
    "include": ["../src"]
}

在 D:\TSProject 目录下执行 tsc --showconfig 命令,输出结果如下。

> {
>     "compilerOptions": {
>         "target": "es3",
>         "module": "commonjs"
>     },
>     "files": [
>         "./src/a.ts"
>     ],
>     "include": [
>         "base/../src"
>     ]
> }

可以看到编译器成功找到了 src 目录并执行编译。

其他配置

filesincludeexcludecompilerOptionsreferences 等根配置项之外,tsconfig.json 文件中还具有 compileOnSavebuildOptionswatchOptions 等根配置项,它们的作用如下。

{
  /*布尔类型,可以让 IDE 在保存文件的时候根据 tsconfig.json 重新生成编译后的文件*/
  "compileOnSave": true,
  /*构建选项,主要适用于--build命令*/
  "buildOptions": {
    /*使用此选项后,TypeScript将避免重新检查及构建全部文件,而只重新检查/构建已更改的文件以及直
    接导入它们中的文件*/
    "assumeChangesOnlyAffectDirectDependencies": false,
    /*显示将要执行的操作但是并不真正进行这些操作*/
    "dry": false,
    /*强制把所有项目当作非最新版本对待*/
    "force": false,
    /*输出详细的日志*/
    "verbose": false,
    /*是否生成.tsbuildinfo文件,以此判断是否启用增量编译,tsconfig.tsbuildinfo文件存储了本
    次编译中各个文件的版本(文件MD5)信息,当下次再进行编译时,将用于判断是否需要重新编译各个文件*/
    "incremental": false,
    /*如果要检查模块为什么没包含进来,可将其设置为true,以便输出相关文件的解析过程信息*/
    "traceResolution": false
  },
  /*配置使用哪种监听策略来跟踪文件和目录*/
  "watchOptions": {
    /*字符串数组,用于指定不需要监听变化的目录*/
    "excludeDirectories": ["无须监听的目录1","无须监听的目录2"],
    /*字符串数组,用于指定不需要监听变化的文件*/
    "excludeFiles": ["无须监听的文件1","无须监听的文件2"],
    /*是否同步监听文件变化*/
    "synchronousWatchDirectory": true,
    /*目录监听策略,可设置为以下值*/
    /*usefsevents,采用操作系统的文件系统的原生事件机制监听目录更改*/
    /*fixedpollinginterval,以固定的时间间隔检查各目录的更改数次*/
    /*dynamicprioritypolling,根据目录的修改频率动态调整监听频次*/
    "watchDirectory": "usefsevents",
    /*文件监听策略,可以设置为以下值*/
    /*usefsevents,采用操作系统的文件系统的原生事件机制监听文件更改*/
    /*fixedpollinginterval,以固定的时间间隔检查各文件的更改数次*/
    /*prioritypollinginterval,以固定时间间隔检查各文件的更改次数,但根据文件类型有不同的频次*/
    /*dynamicprioritypolling,根据文件的修改频率动态调整监听频次*/
    /*usefseventsonparentdirectory,采用操作系统的文件系统的原生事件机制监听父级目录更改*/
    "watchFile": "usefsevents",
    /*当采用操作系统的文件系统的原生事件机制监听文件时,此选项指定本机的文件监听器被耗尽或者不支持
    本机文件监听器时编译器采用轮询策略,可设置为以下值*/
    /*fixedinterval,以固定的时间间隔检查各文件的更改数次*/
    /*priorityinterval,以固定的时间间隔检查各文件的更改次数,但根据文件类型有不同的频次*/
    /*dynamicpriority,根据文件的修改频率动态调整监听频次*/
    "fallbackPolling": "dynamicpriority"
  }
}