tsconfig配置

约 1220 字

tsconfig.json 是 TypeScript 的配置文件，用于配置 TypeScript 编译器的行为。

{
  "compilerOptions": {
    /* 基本选项 */
    "target": "es5",                          // 指定ECMAScript目标版本: 'ES3' (默认值，支持IE8才用这个), 'ES5', 'ES6'/ 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', 'ESNext'。
    "module": "es6",                       // 指定生成的 JavaScript 代码应该使用哪种模块系统，影响模块的导入导出语法。'none', 'commonjs', 'amd', 'system', 'umd', 'es6'/'es2015', 'esnext'
    "lib": ["es2015", "dom"],                 // 指定要包含在编译中的库文件
    "allowJs": true,                          // 允许编译JavaScript文件
    "checkJs": false,                         // 报告JavaScript文件中的错误
    "jsx": "react",                           // 指定JSX代码生成: preserve, react, react-native, react-jsx, react-jsxdev
    "declaration": true,                      // 生成相应的 '.d.ts' 文件
    "sourceMap": true,                        // 生成相应的 '.map' 文件
    "outFile": "./",                          // 将输出文件合并为一个文件
    "outDir": "./dist",                       // 指定输出目录
    "rootDir": "./src",                       // 指定输入文件的根目录
    "removeComments": true,                   // 删除编译后的所有注释
    "noEmit": true,                           // 设为 true，通常用于与 Babel 等工具配合使用，让 TypeScript 只负责类型检查。
    "incremental": true,                      // 增量编译

    /* 严格的类型检查选项 */
    "strict": true,                           // 启用所有严格类型检查选项
    "noImplicitAny": true,                    // 在表达式和声明上有隐含的 any类型时报错
    "strictNullChecks": true,                 // 启用严格的null检查
    "strictFunctionTypes": true,              // 启用严格检查函数类型
    "strictBindCallApply": true,              // 启用严格的`bind`, `call`和`apply`方法检查
    "strictPropertyInitialization": true,     // 启用类属性的严格检查
    "noImplicitThis": true,                   // 当 this 表达式值为 any 类型的时候，生成一个错误
    "alwaysStrict": true,                     // 以严格模式检查每个模块，并在每个文件里加入 "use strict"

    /* 额外的检查 */
    "noUnusedLocals": true,                   // 有未使用的变量时，抛出错误
    "noUnusedParameters": true,               // 有未使用的参数时，抛出错误
    "noImplicitReturns": true,                // 并不是所有函数都有返回值时，抛出错误
    "noFallthroughCasesInSwitch": true,       // 报告switch语句的fallthrough错误

    /* 模块解析选项 */
    "moduleResolution": "node",               // 指定模块解析策略: 'node' (Node.js) 或 'classic' (TypeScript pre-1.6)。使用 "node"，这是最常用的模块解析策略。
    "baseUrl": "./",                          // 用于解析非相对模块名称的基目录
    "paths": {                                // 模块名到基于baseUrl的路径映射的列表
      "*": ["node_modules/*", "src/types/*"]
    },
    "rootDirs": ["src", "generated"],         // 根文件夹列表，其组合内容表示项目运行时的结构
    "typeRoots": ["./node_modules/@types"],   // 包含类型声明的文件列表
    "types": ["node", "jest"],                // 需要包含的类型声明文件名列表
    "allowSyntheticDefaultImports": true,     // 允许从没有设置默认导出的模块中默认导入
    "esModuleInterop": true,                  // 允许对CommonJS和ES模块之间进行互操作

    /* Source Map 选项 */
    "sourceRoot": "./src",                    // 指定调试器应该找到TypeScript文件而不是源文件的位置
    "mapRoot": "./",                          // 指定调试器应该找到映射文件而不是生成文件的位置
    "inlineSourceMap": false,                 // 生成单个文件的内联源映射
    "inlineSources": true,                    // 在单个文件中包含代码源

    /* 实验性选项 */
    "experimentalDecorators": true,           // 启用实验性的ES装饰器
    "emitDecoratorMetadata": true             // 为装饰器提供元数据的支持
  },
  /* 其他选项 */
  "skipLibCheck": true,                       // 跳过对声明文件的类型检查
  "forceConsistentCasingInFileNames": true,   // 强制文件名大小写一致
  "resolveJsonModule": true,                  // 允许导入 JSON 模块
  "isolatedModules": true,                    // 确保每个文件都可以安全地进行单独编译
  "noEmitOnError": true,                      // 发生错误时不生成输出文件
  "preserveConstEnums": true,                 // 保留 const 枚举声明
  "declarationMap": true,                     // 为声明文件生成源映射
"importHelpers": true,                      // 从 tslib 导入辅助工具函数
  "lib": ["es2018", "dom"],                   // 指定要包含在编译中的库文件
  "target": "es5",                            // 指定 ECMAScript 目标版本
  "module": "esnext",                         // 指定生成哪个模块系统代码
  "include": [                                // 指定要包含在编译中的文件或目录
    "src/**/*"                                // 这里包含了src目录下的所有文件和子目录。
  ],
  "exclude": [                                // 指定要排除在编译之外的文件或目录
    "node_modules",
    "**/*.spec.ts"
  ]
}

1. target

ES3 和 ES5 的区别

以下是 ES3 和 ES5 的主要区别：

发布时间：
- ES3：1999 年发布
- ES5：2009 年发布 2. 语言特性：
ES5 相比 ES3 增加了许多新特性，主要包括：
- 严格模式（"use strict"）
- JSON 支持（JSON.parse() 和 JSON.stringify()）
- 数组方法：forEach(), map(), filter(), reduce(), some(), every() 等
- 对象方法：Object.create(), Object.keys(), Object.defineProperty() 等
- Function.prototype.bind()
- 属性访问器（getter 和 setter）
浏览器支持：
- ES3：几乎所有浏览器都支持
- ES5：现代浏览器都支持，但一些旧版本的 IE（如 IE8 及以下）不完全支持

结论

"target": "es5" 时，编译器会将 TypeScript 代码编译为相应版本的 JavaScript。选择 ES5 通常是更好的选择，因为它提供了更多的语言特性和更好的浏览器兼容性。只有在需要支持非常旧的浏览器时，才会考虑使用 ES3。