compilerOptions配置项详解

1、 "target": 

•     说明: 指定编译输出的 ECMAScript 版本。
•     可选值: ES3 (默认)、 ES5、ES6 / ES2015、 ES2016 / ES2017 / ES2018 / ES2019 / ES2020 / ES2021 / ESNext

2、 "module": 

•    说明: 指定编译输出的模块系统类型。常用于指定如何组织和引入模块。
•    可选值: CommonJS (Node.js 默认)、 AMD 、ES6 / ESNext (ECMAScript 模块)、System、UMD、None（不生成模块）

3、 "lib": 

• 作用解释：如果你指定了 "lib": ["es6"]，那么 TypeScript 会包含 ECMAScript 6（ES6）的标准库，像是 Promise、Map 等新特性会被正确识别和支持。如果没有显式设置 lib，TypeScript 会根据目标版本（target）自动选择一些默认的库文件。
• 说明: 指定编译时包含的库文件，影响内置对象的可用性。
• 可选值: ES6, ES2020, DOM, WebWorker, Node 你可以通过数组指定多个库。

 4、 "allowJs":

• 说明: 允许编译 .js 文件，TypeScript 会将其视为 JavaScript 文件进行编译。

对js文件的处理

1. 复制：.js 文件会被复制到输出目录。
2. 转换：如果需要，TypeScript 会根据配置对 .js 文件进行 语法转换，如目标版本的转换（target）或模块系统的转换（module）。但是 不会进行类型检查。
3. 不处理类型：allowJs 只会让 TypeScript 处理 .js 文件的语法和输出，但不会对其中的类型进行检查。

5、checkJs

• 说明: 在编译 .js 文件时进行类型检查（即使文件是 JavaScript 代码）。

为什么 checkJs 不是多余的？

1. 增强错误检测：它提供了对 JavaScript 代码的类型检查，有助于提前发现潜在的错误。
2. 无缝过渡到 TypeScript：对于逐步迁移到 TypeScript 的项目，启用 checkJs 可以帮助检查现有的 JavaScript 代码，找出类型问题，而无需立即将代码完全迁移到 TypeScript。
3. 提升代码质量：即使没有明确的类型定义，checkJs 通过推断提供了类型检查，可以让 JavaScript 代码更健壮。

6、esModuleInterop

• 说明: 允许默认导入非 ES6 模块（如 CommonJS），使得 import x from "module" 语法可以正常工作。

esModuleInterop 的作用

• 当你启用 esModuleInterop 时，TypeScript 会对 CommonJS 模块和其他非 ES6 模块做一些 转换，使得你可以使用类似 import x from "module" 的语法来导入这些模块。
• 换句话说，启用 esModuleInterop 后，TypeScript 会在 CommonJS 模块导入时模拟默认导出。这使得你可以像使用 ES6 模块一样，直接使用 import x from "module" 语法来导入 CommonJS 模块。

示例：

假设有一个 CommonJS 模块：

// commonjs-module.js
module.exports = function() { console.log("Hello from CommonJS") }

在 TypeScript 中，如果启用了 esModuleInterop，你可以这样导入并使用它：

import x from "./commonjs-module";  // 现在可以像使用 ES6 模块一样导入
x();  // 输出: "Hello from CommonJS"

7、forceConsistentCasingInFileNames

• 说明: 强制文件名的大小写一致性。确保大小写不同的文件名视为不同文件。

8、moduleResolution

• 说明: 指定模块解析策略。控制 TypeScript 如何解析模块路径。
• classic：适用于早期的模块解析，比较基础，不会自动支持像 Node.js 的 node_modules 查找机制。
• node：适用于现代 JavaScript 和 Node.js 的模块解析，支持更复杂的模块查找规则，包括 node_modules 目录等。适合大多数现代项目。

9、noImplicitAny

• 说明: 启用后，所有隐式 any 类型会抛出错误，即不能让编译器自动推断为 any。

10、strict

• 说明: 启用所有严格的类型检查选项，包括：
  • noImplicitAny：禁止隐式的 any 类型，要求显式声明类型。
  • strictNullChecks：严格区分 null 和 undefined 与其他类型的赋值关系。
  • strictFunctionTypes：使函数类型参数匹配更严格，避免意外的类型不兼容。
  • noImplicitThis：要求明确声明函数中的 this 类型，避免 this 类型不明确的问题。
  • alwaysStrict：强制生成的 JavaScript 启用严格模式，避免一些不安全的行为。

• noImplicitThis

• 作用：此选项要求在函数中使用 this 时，必须显式地声明其类型。如果函数没有明确指定 this 的类型，TypeScript 会报错。

• 默认行为：如果禁用该选项，this 的类型默认为 any，这可能导致一些潜在的类型错误。

• 启用后效果：

  • 如果函数内部使用了 this，你必须在函数声明时明确指定 this 的类型，否则 TypeScript 会报错。

  示例：

function myFunction() {
  console.log(this.value); // 错误：隐式的 'this' 类型为 'any'
}

解决方法：

function myFunction(this: { value: string }) {
  console.log(this.value); // 正确
}

11、noEmit

• 说明: 编译时不生成任何输出文件，仅进行类型检查。

12、outDir

• 说明: 指定输出文件的目录。

13、rootDir

• 说明: 指定输入文件的根目录。TypeScript 会将此目录下的所有文件进行编译。

14、removeComments

• 说明: 是否从生成的 JavaScript 文件中移除注释。

15、sourceMap

• 说明: 是否生成 .map 文件，供调试使用，将编译后的代码与原始 TypeScript 代码映射起来。

16、skipLibCheck

• 说明: 跳过库文件的类型检查，通常用于加速编译过程。

17、strictNullChecks

• 说明: 启用严格的 null 和 undefined 类型检查，不会将 null 和 undefined 自动视为任何类型。

18、resolveJsonModule

• 说明: 允许导入 .json 文件作为模块。

19、incremental

• 说明: 启用增量编译，保留编译的中间状态，以加速后续编译。

20、noFallthroughCasesInSwitch

• 说明: 禁止 switch 语句中 case 穿透（fall-through）。如果没有 break，会报错。

21、isolatedModules

• 说明: 启用模块隔离，常用于与 Babel 等工具一起使用，确保每个文件都是独立的模块。

原文地址：https://blog.csdn.net/weixin_47808575/article/details/145160002

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！