编译选项

编译选项控制 TypeScript 编译器的行为。通过合理配置编译选项，可以优化编译输出、启用严格检查、提高代码质量。

目标选项

target

target 指定编译后的 JavaScript 版本。

{
  "compilerOptions": {
    "target": "ES2020"
  }
}

可选值：ES3、ES5、ES6/ES2015、ES2016、ES2017、ES2018、ES2019、ES2020、ES2021、ES2022、ESNext。

module

module 指定模块系统。

{
  "compilerOptions": {
    "module": "ESNext"
  }
}

可选值：CommonJS、AMD、System、UMD、ES6/ES2015、ES2020、ES2022、ESNext、NodeNext、Node16。

lib

lib 指定运行时库。

{
  "compilerOptions": {
    "lib": ["ES2020", "DOM", "DOM.Iterable"]
  }
}

常用库：ES2020、ES2021、ES2022、DOM、DOM.Iterable、ScriptHost、WebWorker。

输出选项

outDir

outDir 指定输出目录。

{
  "compilerOptions": {
    "outDir": "./dist"
  }
}

rootDir

rootDir 指定源码目录。

{
  "compilerOptions": {
    "rootDir": "./src"
  }
}

outFile

outFile 将所有输出合并到一个文件。

{
  "compilerOptions": {
    "outFile": "./dist/bundle.js"
  }
}

仅适用于 AMD、System 和 UMD 模块系统。

declaration

declaration 生成类型声明文件。

{
  "compilerOptions": {
    "declaration": true
  }
}

sourceMap

sourceMap 生成 source map 文件。

{
  "compilerOptions": {
    "sourceMap": true
  }
}

严格选项

strict

strict 启用所有严格类型检查选项。

{
  "compilerOptions": {
    "strict": true
  }
}

noImplicitAny

noImplicitAny 禁止隐式 any 类型。

{
  "compilerOptions": {
    "noImplicitAny": true
  }
}

strictNullChecks

strictNullChecks 启用严格的 null 检查。

{
  "compilerOptions": {
    "strictNullChecks": true
  }
}

strictFunctionTypes

strictFunctionTypes 启用严格的函数类型检查。

{
  "compilerOptions": {
    "strictFunctionTypes": true
  }
}

strictPropertyInitialization

strictPropertyInitialization 确保类属性初始化。

{
  "compilerOptions": {
    "strictPropertyInitialization": true
  }
}

模块选项

moduleResolution

moduleResolution 指定模块解析策略。

{
  "compilerOptions": {
    "moduleResolution": "node"
  }
}

可选值：node、classic、node16、nodenext。

esModuleInterop

esModuleInterop 启用 ES 模块互操作性。

{
  "compilerOptions": {
    "esModuleInterop": true
  }
}

allowSyntheticDefaultImports

allowSyntheticDefaultImports 允许合成默认导入。

{
  "compilerOptions": {
    "allowSyntheticDefaultImports": true
  }
}

路径选项

baseUrl

baseUrl 设置模块解析的基础路径。

{
  "compilerOptions": {
    "baseUrl": "."
  }
}

paths

paths 设置路径映射。

{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

rootDirs

rootDirs 设置多个根目录。

{
  "compilerOptions": {
    "rootDirs": ["src", "generated"]
  }
}

类型选项

typeRoots

typeRoots 指定类型声明文件的根目录。

{
  "compilerOptions": {
    "typeRoots": ["./types", "./node_modules/@types"]
  }
}

types

types 指定要包含的类型声明。

{
  "compilerOptions": {
    "types": ["node", "jest"]
  }
}

检查选项

noUnusedLocals

noUnusedLocals 检查未使用的局部变量。

{
  "compilerOptions": {
    "noUnusedLocals": true
  }
}

noUnusedParameters

noUnusedParameters 检查未使用的参数。

{
  "compilerOptions": {
    "noUnusedParameters": true
  }
}

noImplicitReturns

noImplicitReturns 检查函数所有路径都有返回值。

{
  "compilerOptions": {
    "noImplicitReturns": true
  }
}

noFallthroughCasesInSwitch

noFallthroughCasesInSwitch 检查 switch 语句的 fallthrough。

{
  "compilerOptions": {
    "noFallthroughCasesInSwitch": true
  }
}

实际应用

一个推荐的编译选项配置。

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "ESNext",
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "moduleResolution": "node",
    "strict": true,
    "noImplicitAny": true,
    "strictNullChecks": true,
    "strictFunctionTypes": true,
    "strictBindCallApply": true,
    "strictPropertyInitialization": true,
    "noImplicitThis": true,
    "alwaysStrict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "declaration": true,
    "declarationMap": true,
    "sourceMap": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  }
}

小结

编译选项控制 TypeScript 编译器的行为。目标选项指定 JavaScript 版本和模块系统。输出选项控制编译输出。严格选项启用类型检查。模块选项控制模块解析。路径选项简化模块导入。检查选项发现潜在问题。合理配置编译选项可以提高代码质量和开发效率。