1️⃣ TS 生成的配置

**tsc --init** 生成 TS 的配置文件

  1. {
  2.   "compilerOptions": {
  3.     // 访问 https://aka.ms/tsconfig 以阅读有关此文件的更多信息
  5.     /**
  6.     * 项目
  7.     */
  8.     "incremental": true,                               // TS编译器在第一次编译之后会生成一个存储编译信息的文件，第二次编译会在第一次的基础上进行增量编译，可以提高编译的速度
  9.     "composite": true,                                 // 是否构建引用项目, 与 reference 联合使用
  10.     "tsBuildInfoFile": "./.tsbuildinfo",               // 增量编译文件的存储位置
  11.     "disableSourceOfProjectReferenceRedirect": true,   // 引用复合项目时禁用首选源文件而不是声明文件.
  12.     "disableSolutionSearching": true,                  // 编辑时选择项目退出多项目参考检查。
  13.     "disableReferencedProjectLoad": true,              // 减少 TypeScript 自动加载的项目数量。
  15.     /**
  16.     * 语言与环境
  17.     */
  18.     "target": "ES6",                                   // 定义ECMAScript的版本, 默认为ES3, 有以下选项可选 'ES3', 'ES5', 'ES6'/'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ESNext'
  19.     "lib": [                                           // 可包含值
  20.       "ES6",
  21.       "ES7",
  22.       "ES2015",
  23.       "ES2015.Collection",
  24.       "ES2015.Core",
  25.       "ES2015.Generator",
  26.       "ES2015.Iterable",
  27.       "ES2015.Promise",
  28.       "ES2015.Proxy",
  29.       "ES2015.Reflect",
  30.       "ES2015.Symbol.WellKnown",
  31.       "ES2015.Symbol",
  32.       "ES2016",
  33.       "ES2016.Array.Include",
  34.       "ES2017",
  35.       "ES2017.Intl",
  36.       "ES2017.Object",
  37.       "ES2017.SharedMemory",
  38.       "ES2017.String",
  39.       "ES2017.TypedArrays",
  40.       "ES2018",
  41.       "ES2018.AsyncIterable",
  42.       "ES2018.Intl",
  43.       "ES2018.Promise",
  44.       "ES2018.Regexp",
  45.       "ES2019",
  46.       "ES2019.Array",
  47.       "ES2019.Object",
  48.       "ES2019.String",
  49.       "ES2019.Symbol",
  50.       "ES2020",
  51.       "ES2020.BigInt",
  52.       "ES2020.Promise",
  53.       "ES2020.String",
  54.       "ES2020.Symbol.WellKnown",
  55.       "ESNext",
  56.       "ESNext.Array",
  57.       "ESNext.AsyncIterable",
  58.       "ESNext.BigInt",
  59.       "ESNext.Intl",
  60.       "ESNext.Symbol",
  61.       "DOM",
  62.       "DOM.Iterable",
  63.       "ScriptHost",
  64.       "WebWorker",
  65.       "WebWorker.ImportScripts"
  66.     ],                                       // TS 需要引用的库，即声明文件，es5 默认引用dom、es5、scripthost,如需要使用es的高级版本特性，通常都需要配置，如es8的数组新特性需要引入"ES2019.Array", 可包含值看列表
  67.     "jsx": "preserve",                                 // 指定生成的 JSX 代码。
  68.     "experimentalDecorators": true,                    // 是否开启实验室的对 ES7 的装饰器支持
  69.     "emitDecoratorMetadata": true,                     // 装饰器元数据的支持, 可以访问 Reflect 提供的静态方法, 需要在 lib 中加入 es2015.Reflect 这个库
  70.     "jsxFactory": "",                                  // 定义当目标是 react JSX时触发的工厂函数 比如. 'React.createElement' or 'h'. 2.1版本以上
  71.     "jsxFragmentFactory": "",                          // 指定针对 React JSX 发射时用于片段的 JSX 片段引用，例如 “React.Fragment” 或 “Fragment”。
  72.     "jsxImportSource": "",                             // 指定用于在使用 'jsx: react-jsx*' 时导入 JSX 工厂函数的模块说明符。
  73.     "reactNamespace": "",                              // 指定为 “createElement” 调用的对象。 这仅适用于针对 'react' JSX 发射的情况。
  74.     "noLib": true,                                     // 禁用包含任何库文件，包括默认的 lib.d.ts。
  75.     "useDefineForClassFields": true,                   // 发出符合 ECMAScript 标准的类字段。
  76.     "moduleDetection": "auto",                         // 控制使用什么方法来检测模块格式的 JS 文件。
  78.     /**
  79.     * 模块
  80.     */
  81.     "module": "commonjs",                              // 指定生成什么模块代码。
  82.     "rootDir": "./",                                   // 值为字符串, 告诉编译器相对路径的根目录, 如果 rootDir 下没有完全包含 include 或 file 字段涉及的文件, 编译过程会报错, 但是不会中断编译
  83.     "moduleResolution": "node",                        // 模块解析策略, 仅 node 和 classic 可选, 只需要使用 npm 安装的第三方库就需要指定为 node, classic 多用于向后兼容
  84.     "baseUrl": "./",                                   // 非相对路径时的base路径, 非相对路径指非以下三种开头的导入
  85.     "paths": {},                                       // 模块名基于 baseUrl 的路径映射
  86.     "rootDirs": [],                                    // 因为 rootDirs 是指定了一个root的列表,参见官网的例子
  87.     "typeRoots": [],                                   // 值为数组, 用于指定声明文件或文件夹的路径列表, 如果配置了该项, 那么只有这里面匹配的声明文件才会被加载
  88.     "types": [],                                       // 值为数组, 用于指定要加载类型的模块名称, 只有在该数组下的模块才会加载声明文件(最终影响的只是声明文件, 并未影响模块的加载)
  89.     "allowUmdGlobalAccess": true,                      // 允许从模块访问 UMD 全局变量。
  90.     "moduleSuffixes": [],                              // 解析模块时要搜索的文件名后缀列表。
  91.     "resolveJsonModule": true,                         // 启用导入 .json 文件。
  92.     "noResolve": true,                                 // 禁止 'import's、'require's 或 '<reference>'s 扩展 TypeScript 应添加到项目中的文件数量。
  94.     /**
  95.      *  JavaScript 支持
  96.      */
  97.     "allowJs": true,                                   // 允许 JavaScript 文件成为程序的一部分。 使用“checkJS”选项从这些文件中获取错误。
  98.     "checkJs": true,                                   // 在类型检查的 JavaScript 文件中启用错误报告。
  99.     "maxNodeModuleJsDepth": 1,                         // 指定用于从 “node_modules” 检查 JavaScript 文件的最大文件夹深度。 仅适用于 “allowJs”。
  101.     // Emit
  102.     "declaration": true,                               // 是否在编译的时候为模块生成一个.d.ts 的声明文件, 不能与 allowJs 同时设为 true.
  103.     "declarationMap": true,                            // 为 d.ts 文件创建源映射。
  104.     "emitDeclarationOnly": true,                       // 只输出 d.ts 文件，不输出 JavaScript 文件。
  105.     "sourceMap": true,                                 // 为发出的 JavaScript 文件创建源映射文件。
  106.     "outFile": "./",                                   // 指定输出的文件合并为一个文件, 仅在 module: 'system'|'amd' 生效
  107.     "outDir": "./",                                    // 输出文件要放置的文件夹
  108.     "removeComments": true,                            // 禁用发出评论。
  109.     "noEmit": true,                                    // 禁用从编译中发出文件。
  110.     "importHelpers": true,                             // 允许每个项目从 tslib 导入帮助函数一次，而不是在每个文件中包含它们。
  111.     "importsNotUsedAsValues": "remove",                // 为仅用于类型的导入指定发出/检查行为。
  112.     "downlevelIteration": true,                        // 为迭代发出更合规但冗长且性能更低的 JavaScript。
  113.     "sourceRoot": "",                                  // 定义在调试时应该定位的 ts 文件路径而不是源路径, 值为一个字符串, 该值会被写进 .map 文件里.
  114.     "mapRoot": "",                                     // 定义调试时应该定位的源文件而不是生成文件的位置, 指定 map 文件的根路径, 该值会影响 .map 文件的 source 属性
  115.     "inlineSourceMap": true,                           // 是否生成一个包含 source-map 在一起的单文件还是分开的 js, 如果设置为 true, 生成的 js 底部会以 #sourceMappingURL=base64 的字符串
  116.     "inlineSources": true,                             // 是否将 ts 文件的内容也包含到 js 文件中
  117.     "emitBOM": true,                                   // 在输出文件的开头发出 UTF-8 字节顺序标记 (BOM)。
  118.     "newLine": "crlf",                                 // 设置用于发出文件的换行符。
  119.     "stripInternal": true,                             // 禁止发出在其 JSDoc 注释中包含 “@internal” 的声明。
  120.     "noEmitHelpers": true,                             // 禁用在编译输出中生成自定义帮助函数，如“__extends”。
  121.     "noEmitOnError": true,                             // 如果报告任何类型检查错误，则禁用发出文件。
  122.     "preserveConstEnums": true,                        // 禁用擦除生成代码中的“常量枚举”声明。
  123.     "declarationDir": "./",                            // 指定生成的声明文件的输出目录。
  124.     "preserveValueImports": true,                      // 在 JavaScript 输出中保留未使用的导入值，否则这些值将被删除。
  126.     /**
  127.     * 互操作约束
  128.     */
  129.     "isolatedModules": true,                           // 是否将每个文件作为单独的模块, 如果设置为 true(默认), 不能与 declaration 同时使用
  130.     "allowSyntheticDefaultImports": true,              // 允许对没有默认导出的模块使用默认导入, 这不影响代码生成, 只是为了类型检查. 注意这里的默认值不是固定的, 而是按照 module === "system" or --esModuleInterop 来决定.
  131.     "esModuleInterop": true,                           // 是否为导入的模块创建命名空间, 实现 commonjs 和 es 模块之间的互操作性, 其提供了 __importStar 和 __importDefault 两个帮助函数
  132.     "preserveSymlinks": true,                          // 禁用解析符号链接到他们的真实路径。 这与节点中的相同标志相关。
  133.     "forceConsistentCasingInFileNames": true,          // 确保进口中的大小写正确。
  135.     /**
  136.     * 类型检查
  137.     */
  138.     "strict": true,                                    // 启用所有严格的类型检查选项. ( 当 strict 设置为 true 时下列的所有选项默认为 true )
  139.      "noImplicitAny": true,                            // 不允许有隐式的 any
  140.      "strictNullChecks": true,                         // null 和 undefined 不允许赋值给非 null 和 undefined 的值(undefined可以赋值给void除外), 反之除了 any 亦然, unknown 不在这个限制中
  141.      "strictFunctionTypes": true,                      // 分配函数时，检查以确保参数和返回值是子类型兼容的.
  142.      "strictBindCallApply": true,                      // 检查 “bind”、“call” 和 “apply” 方法的参数是否与原始函数匹配。
  143.      "strictPropertyInitialization": true,             // 是否在初始值类型为非 null 或 undefined 的值设置初始值, 设置为 true 时需要开启 strictNullChecks
  144.      "noImplicitThis": true,                           // this 的值为 any 时报错
  145.      "useUnknownInCatchVariables": true,               // 默认 catch 子句变量为 “unknown” 而不是“any”。
  146.      "alwaysStrict": true,                             // 以严格模式编译模块, 且会在生成的 js 文件的顶部添加 'use strict'
  147.      "noUnusedLocals": true,                           // 是否允许未使用的变量, 可以配置 eslint
  148.      "noUnusedParameters": true,                       // 是否允许未使用的函数参数, 可以配置 eslint
  149.      "exactOptionalPropertyTypes": true,               // 将可选属性类型解释为书面形式，而不是添加 “undefined”。
  150.      "noImplicitReturns": true,                        // 是否要求所有的函数代码必须有返回值
  151.      "noFallthroughCasesInSwitch": true,               // 是否允许贯穿的 switch-case
  152.      "noUncheckedIndexedAccess": true,                 // 使用索引访问时将 “undefined” 添加到类型。
  153.      "noImplicitOverride": true,                       // 确保派生类中的覆盖成员使用覆盖修饰符进行标记。
  154.      "noPropertyAccessFromIndexSignature": true,       // 对使用索引类型声明的键强制使用索引访问器。
  155.      "allowUnusedLabels": true,                        // 禁用未使用标签的错误报告。
  156.      "allowUnreachableCode": true,                     // 禁用无法访问代码的错误报告。
  158.     /**
  159.     * 完整性
  160.     */
  161.     "skipDefaultLibCheck": true,                       // 跳过 TypeScript 中包含的类型检查 .d.ts 文件。
  162.     "skipLibCheck": true                               // 跳过类型检查所有 .d.ts 文件。
  163.   },
  165.   /**
  166.   * 包含
  167.   */
  168.   "include": [
  169.     "./src"
  170.   ],
  172.   /**
  173.   * 忽略
  174.   */
  175.   "exclude": [
  176.     "node_modules",
  177.   ]
  178. }

1️⃣ 常用配置