自学内容网 自学内容网

tsconfig.json 内容解读

tsconfig.json 文件是 TypeScript 项目的主要配置文件,用于指定编译选项和项目设置。通过这个文件,你可以控制编译器的行为,例如输出文件的路径、模块解析方式、严格类型检查等。

以下是一些常见的 tsconfig.json 属性及其详细解释:

顶层属性

1、compilerOptions
  • 包含编译器选项,用于控制编译过程。
{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "outDir": "./dist",
    "strict": true
  }
}
2、include
  • 指定要包含在编译中的文件或文件夹。
  • 支持通配符(如 * 和 **)。
{
  "include": ["src/**/*"]
}
3、exclude
  • 指定要排除在编译之外的文件或文件夹。
  • 支持通配符(如 * 和 **)。
{
  "exclude": ["node_modules", "dist"]
}
4、files
  • 显式列出要包含在编译中的文件。
  • 不支持通配符。
{
  "files": ["src/index.ts", "src/utils.ts"]
}
5、references
  • 用于项目引用,支持多项目构建。
{
  "references": [
    { "path": "./src" },
    { "path": "./test" }
  ]
}
6、extends
  • 继承另一个 tsconfig.json 文件的配置。
{
  "extends": "../tsconfig.base.json"
}

compilerOptions 属性

1、target
  • 指定编译后的 JavaScript 版本。
  • 常见值:es3es5es6(或 es2015),es2017es2018es2019es2020es2021esnext
"target": "es6"
2、module
  • 指定模块代码生成的方式。
  • 常见值:nonecommonjsamdsystemumdes6(或 es2015),es2020esnext
"module": "commonjs"
3、outDir
  • 指定编译输出文件的目录。
"outDir": "./dist"
4、rootDir
  • 指定源代码的根目录。
  • 编译器会根据这个目录来确定输出文件的相对路径。
"rootDir": "./src"
5、strict
  • 启用所有严格的类型检查选项。
  • 包括 noImplicitAnynoImplicitThisalwaysStrictstrictBindCallApplystrictFunctionTypesstrictNullChecksstrictPropertyInitialization
"strict": true
6、esModuleInterop
  • 启用 CommonJS 和 ES 模块之间的互操作性。
"esModuleInterop": true
7、skipLibCheck
  • 跳过对库文件的类型检查,可以加快编译速度。
"skipLibCheck": true
8、forceConsistentCasingInFileNames
  • 确保文件名在导入时保持一致的大小写。
"forceConsistentCasingInFileNames": true

9、resolveJsonModule:

  • 允许导入 JSON 模块。
"resolveJsonModule": true
10、allowJs
  • 允许编译 JavaScript 文件。
"allowJs": true
11、checkJs
  • 对 JavaScript 文件进行类型检查。
"checkJs": true
12、declaration
  • 生成 .d.ts 声明文件。
"declaration": true
13、sourceMap

生成源映射文件,便于调试。

"sourceMap": true
14、noEmit
  • 不生成输出文件,仅进行类型检查。
"noEmit": true
15、lib
  • 指定编译器可以使用的 JavaScript 标准库的列表。
  • 常见值:domdom.iterablees5es6es2015es2016es2017es2018es2019es2020es2021esnext
"lib": ["dom", "es6"]
16、moduleResolution
  • 指定模块解析策略。
  • 常见值:nodeclassic
"moduleResolution": "node"
17、baseUrl
  • 设置模块解析的基准目录。
"baseUrl": "."
18、paths
  • 用于模块解析的路径映射。
"paths": {
  "@src/*": ["src/*"],
  "@utils/*": ["src/utils/*"]
}
19、typeRoots
  • 指定类型声明文件的根目录。
"typeRoots": ["./types", "./node_modules/@types"]

20、types

  • 指定全局类型声明文件。
"types": ["node", "jest"]

21、noUnusedLocals

  • 报告未使用的局部变量。
"noUnusedLocals": true

22、noUnusedParameters

  • 报告未使用的函数参数。
"noUnusedParameters": true

23、noImplicitReturns

  • 报告函数中隐式的 any 类型返回值。
"noImplicitReturns": true

24、noFallthroughCasesInSwitch

  • 报告 switch 语句中的 fall-through 情况。
"noFallthroughCasesInSwitch": true

示例 tsconfig.json

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "outDir": "./dist",
    "rootDir": "./src",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true,
    "resolveJsonModule": true,
    "allowJs": true,
    "checkJs": true,
    "declaration": true,
    "sourceMap": true,
    "noEmit": false,
    "lib": ["dom", "es6"],
    "moduleResolution": "node",
    "baseUrl": ".",
    "paths": {
      "@src/*": ["src/*"],
      "@utils/*": ["src/utils/*"]
    },
    "typeRoots": ["./types", "./node_modules/@types"],
    "types": ["node", "jest"],
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

通过合理配置 tsconfig.json,可以更好地管理和控制 TypeScript 项目的编译过程,提高开发效率和代码质量。每个属性都有其特定的用途,可以根据项目的具体需求进行调整。


原文地址:https://blog.csdn.net/liangshanbo1215/article/details/143037552

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