什么是 tsconfig.json 配置文件？-- TypeScript 初学者教程

tsconfig.json 文件允许您指定根级文件和编译 TypeScript 项目所需的编译器选项。在目录中存在此文件指定该目录是 TypeScript 项目的根目录。

在这个 TypeScript 教程系列的章节中，我们将学习tsconfig.json，它的各种属性以及如何扩展它。

在这个 TypeScript 教程系列的前几章中，我们学习了如何安装 Node.js 和 TypeScript，然后学习了构建你的第一个 HelloWorld 应用程序（使用 Visual Studio Code）。今天，让我们更进一步，学习tsconfig.json 文件。

"compilerOptions" 属性

"compilerOptions" 属性允许您为 TypeScript 编译器指定其他选项。以下是compilerOptions 属性中一些您可能经常需要使用的可选设置：listFiles、module、outDir、outFile、rootDir、sourceRoot、allowUnreachableCode、allowJs、noImplicitUseStrict、strictNullChecks等等。

这是一个示例 JSON 文件，描述了如何定义包含compilerOptions 属性的不同参数的tsconfig.json 文件。

{
    "compilerOptions": {
        "module": "system",
        "noImplicitAny": true,
        "removeComments": true,
        "allowUnreachableCode": false,
        "strictNullChecks": true,
        "outFile": "../JS/TypeScript/HelloWorld.js",
        "sourceMap": true
    }
}

"compileOnSave" 属性

"compileOnSave" 属性可用于指示 IDE 自动编译包含的 TypeScript 文件并生成输出。以下是如何在tsconfig.json 文件中定义compileOnSave 属性以及其他属性。

{
   "compileOnSave": true,
   "compilerOptions": {
        "module": "system",
        "noImplicitAny": true,
        "removeComments": true,
        "allowUnreachableCode": false,
        "strictNullChecks": true,
        "outFile": "../JS/TypeScript/HelloWorld.js",
        "sourceMap": true
   }
}

"files"、"include" 和 "exclude" 属性

• "files" 属性允许您指定编译器将包含的 TypeScript 文件列表。文件的 URL 可以是相对的或绝对的。
• "include" 属性允许您使用 glob 通配符模式包含 TypeScript 文件列表。
• "exclude" 属性允许您使用 glob 通配符模式排除 TypeScript 文件列表。
• 当您不指定files 和include 属性时，编译器默认包含所有 TypeScript 文件（*.ts、*.d.ts、*.tsx）。
• 当同时指定files 和include 属性时，编译器将包含指定文件的并集。
• 当您想要过滤掉使用include 属性包含的一些文件时，您可以指定exclude 属性。
• 如果您使用files 属性指定任何文件，则exclude 属性的使用将不会对这些列出的文件产生任何影响。简而言之，使用files 属性包含的文件将始终包含，而不管exclude 属性下列出的文件如何。

以下代码片段描述了如何在tsconfig.json 文件中定义files、include 和exclude 属性以及其他属性。

{
   "compileOnSave": true,
   "compilerOptions": {
        "module": "system",
        "noImplicitAny": true,
        "removeComments": true,
        "allowUnreachableCode": false,
        "strictNullChecks": true,
        "outFile": "../JS/TypeScript/HelloWorld.js",
        "sourceMap": true
   },
    "files": [
        "program.ts",
        "sys.ts"
    ],
    "include": [
        "src/**/*"
    ],
    "exclude": [
        "node_modules",
        "src/**/*.spec.ts"
    ]
}

扩展 "tsconfig.json" 文件

您还可以从不同的基础配置扩展 TypeScript 配置文件。您可以使用extends 属性来实现。它接受一个string 值，其中包含要从中继承的另一个配置文件的路径。首先加载基础文件中的配置，然后由继承的配置文件中的配置覆盖。如果存在循环引用，TypeScript 编译器将返回错误。

// tsconfig-base.json
{
    "compilerOptions": {
        "module": "system",
        "noImplicitAny": true,
        "removeComments": true,
        "allowUnreachableCode": false,
        "strictNullChecks": true
    }
}

// tsconfig.json
{
    "extends": "./tsconfig-base",
    "compilerOptions": {
        "outFile": "../JS/TypeScript/HelloWorld.js",
        "sourceMap": true
    }
}

👉 TypeScript 教程 - TypeScript 入门