tsconfig.json配置指南

TypeScript项目的配置文件
tsconfig.json放在ts项目的根目录下,tsconfig.json指定了用来编译这个项目的根文件和编译选项;
TSConfig文件可以是tsconfig.json或jsconfig.json,都具有相同的行为和相同的配置变量集。
官方参考链接

JSON文件是不支持注释的,只要跑的平台认,随便你写撒样都行,这几个可注释:

  • VS Code 的 settings.json
  • Prettier 的 .prettierrc
  • TypeScript 的 tsconfig.json

我在项目里用的tsconfig.json:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
{
"compilerOptions": {
"target": "esnext", // 目标代码类型
"module": "esnext", // 指定生成哪个模块系统代码
"strict": true, // 启用此功能等效于启用所有严格模式系列选项。
"jsx": "preserve", // 控制 JSX 在 JavaScript 文件中的输出方式。 这只影响 .tsx 文件的 JS 文件输出。
"importHelpers": true, //导入辅助:对于某些降级行为,TypeScript 使用一些辅助代码来进行操作
"moduleResolution": "node",//模块解析:指定模块解析策略 node、classic
"experimentalDecorators": true,// 启用实验性的ES装饰器
"skipLibCheck": true, // 跳过声明文件的类型检查
"esModuleInterop": true,//ES 模块互操作性
"allowSyntheticDefaultImports": true,// 允许合成默认导入
"sourceMap": true, // 用于debug ,生成相应的.map文件
"baseUrl": ".", // 解析非相对模块名的基准目录
"types": [ // 要包含的类型声明文件名列表;如果指定了types,只有被列出来的包才会被包含进来
"webpack-env"
],
"paths": { // 模块名到基于baseUrl的路径映射的列表
"@/*": [
"src/*"
]
},
"lib": [ //TypeScript 包括一组默认的内建 JS 接口(例如 Math)的类型定义,以及在浏览器环境中存在的对象的类型定义(例如 document)。 TypeScript 还包括与你指定的 target 选项相匹配的较新的 JS 特性的 API。例如如果target 为 ES6 或更新的环境,那么 Map 的类型定义是可用的。
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [ //指定要包含在程序中的文件名或模式的数组。这些文件名是相对于包含tsconfig.json文件的目录来解析的。
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [ // 指定解析时应跳过的文件名或模式的数组include。
"node_modules"
]
}

网上别人的:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
{
"compilerOptions": { //compilerOptions:编译选项,可以被忽略,这时编译器会使用默认值
"allowSyntheticDefaultImports": true, //允许从没有设置默认导出的模块中默认导入。这并不影响代码的显示,仅为了类型检查。
"baseUrl": "./src", //解析非相对模块名的基准目录
"emitDecoratorMetadata": true, //给源码里的装饰器声明加上设计类型元数据
"experimentalDecorators": true, //启用实验性的ES装饰器
"module": "commonjs", //指定生成哪个模块系统代码
"moduleResolution": "node", //决定如何处理模块。或者是"Node"对于Node.js/io.js,或者是"Classic"(默认)
"noEmitHelpers": true, //不再输出文件中生成用户自定义的帮助函数代码,如__extends。
"noImplicitAny": false, //在表达式和声明上有隐含的any类型时报错
"sourceMap": true, //用于debug ,生成相应的.map文件
"strictNullChecks": false, //在严格的null检查模式下,null和undefined值不包含在任何类型里,只允许用它们自己和any来赋值(有个例外,undefined可以赋值到void)。
"target": "es5", //目标代码类型
"paths": { //模块名到基于baseUrl的路径映射的列表
},
"lib": [ //编译过程中需要引入的库文件的列表
"dom",
"es6"
],
"types": [ //要包含的类型声明文件名列表;如果指定了types,只有被列出来的包才会被包含进来
"hammerjs",
"node",
"source-map",
"uglify-js",
"webpack"
]
},
"exclude": [ //如果"files"和"include"都没有被指定,编译器默认包含当前目录和子目录下所有的TypeScript文件(.ts, .d.ts 和 .tsx),排除在"exclude"里指定的文件。
"node_modules",
"dist"
],
"awesomeTypescriptLoaderOptions": { //Typescript加载选项
"forkChecker": true,
"useWebpackText": true
},
"compileOnSave": false,
"buildOnSave": false,
"atom": { "rewriteTsconfig": false }
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
"compilerOptions": {
"incremental": true, // TS编译器在第一次编译之后会生成一个存储编译信息的文件,第二次编译会在第一次的基础上进行增量编译,可以提高编译的速度
"tsBuildInfoFile": "./buildFile", // 增量编译文件的存储位置
"diagnostics": true, // 打印诊断信息
"target": "ES5", // 目标语言的版本
"module": "CommonJS", // 生成代码的模板标准
"outFile": "./app.js", // 将多个相互依赖的文件生成一个文件,可以用在AMD模块中,即开启时应设置"module": "AMD",
"lib": ["DOM", "ES2015", "ScriptHost", "ES2019.Array"], // TS需要引用的库,即声明文件,es5 默认引用dom、es5、scripthost,如需要使用es的高级版本特性,通常都需要配置,如es8的数组新特性需要引入"ES2019.Array",
"allowJS": true, // 允许编译器编译JS,JSX文件
"checkJs": true, // 允许在JS文件中报错,通常与allowJS一起使用
"outDir": "./dist", // 指定输出目录
"rootDir": "./", // 指定输出文件目录(用于输出),用于控制输出目录结构
"declaration": true, // 生成声明文件,开启后会自动生成声明文件
"declarationDir": "./file", // 指定生成声明文件存放目录
"emitDeclarationOnly": true, // 只生成声明文件,而不会生成js文件
"sourceMap": true, // 生成目标文件的sourceMap文件
"inlineSourceMap": true, // 生成目标文件的inline SourceMap,inline SourceMap会包含在生成的js文件中
"declarationMap": true, // 为声明文件生成sourceMap
"typeRoots": [], // 声明文件目录,默认时node_modules/@types
"types": [], // 加载的声明文件包
"removeComments":true, // 删除注释
"noEmit": true, // 不输出文件,即编译后不会生成任何js文件
"noEmitOnError": true, // 发送错误时不输出任何文件
"noEmitHelpers": true, // 不生成helper函数,减小体积,需要额外安装,常配合importHelpers一起使用
"importHelpers": true, // 通过tslib引入helper函数,文件必须是模块
"downlevelIteration": true, // 降级遍历器实现,如果目标源是es3/5,那么遍历器会有降级的实现
"strict": true, // 开启所有严格的类型检查
"alwaysStrict": true, // 在代码中注入'use strict'
"noImplicitAny": true, // 不允许隐式的any类型
"strictNullChecks": true, // 不允许把null、undefined赋值给其他类型的变量
"strictFunctionTypes": true, // 不允许函数参数双向协变
"strictPropertyInitialization": true, // 类的实例属性必须初始化
"strictBindCallApply": true, // 严格的bind/call/apply检查
"noImplicitThis": true, // 不允许this有隐式的any类型
"noUnusedLocals": true, // 检查只声明、未使用的局部变量(只提示不报错)
"noUnusedParameters": true, // 检查未使用的函数参数(只提示不报错)
"noFallthroughCasesInSwitch": true, // 防止switch语句贯穿(即如果没有break语句后面不会执行)
"noImplicitReturns": true, //每个分支都会有返回值
"esModuleInterop": true, // 允许export=导出,由import from 导入
"allowUmdGlobalAccess": true, // 允许在模块中全局变量的方式访问umd模块
"moduleResolution": "node", // 模块解析策略,ts默认用node的解析策略,即相对的方式导入
"baseUrl": "./", // 解析非相对模块的基地址,默认是当前目录
"paths": { // 路径映射,相对于baseUrl
// 如使用jq时不想使用默认版本,而需要手动指定版本,可进行如下配置
"jquery": ["node_modules/jquery/dist/jquery.min.js"]
},
"rootDirs": ["src","out"], // 将多个目录放在一个虚拟目录下,用于运行时,即编译后引入文件的位置可能发生变化,这也设置可以虚拟src和out在同一个目录下,不用再去改变路径也不会报错
"listEmittedFiles": true, // 打印输出文件
"listFiles": true// 打印编译的文件(包括引用的声明文件)
}

相关参考:
TypeScript项目中的tsconfig.json配置指南