tsconfig.json各选项的解释

tsconfig.json是TypeScript的配置文件,用于定义编译器行为,如目标JavaScript版本、模块系统、输出目录等。它包含compilerOptions、files、include、exclude等字段,还涉及strictNullChecks、esModuleInterop等具体编译选项。这个文件对管理和控制TypeScript项目编译过程至关重要。

tsconfig.json是TypeScript的编译器配置文件,用于定义TypeScript编译器的行为。各个选项的作用如下:

  1. “compilerOptions”: 编译器选项,用于配置TypeScript编译器的行为。包括指定目标JS版本、模块化方式、输出目录、是否生成source map等。

  2. “files”: 指定需要编译的文件列表,可以是相对或绝对路径。若未指定此项,则编译器将编译项目下所有包含在"include"选项中的文件。

  3. “include”: 包含需要编译的文件的glob路径模式。

  4. “exclude”: 排除不需要编译的文件的glob路径模式。

  5. “extends”: 用于扩展其他tsconfig.json配置,可以被配置文件继承。

  6. “compileOnSave”: 是否在保存文件时自动编译。

  7. “references”: 使用项目引用,可以将一个项目作为另一个项目的依赖。

  8. “typeAcquisition”: 自动获取类型声明的设置。

  9. “angularCompilerOptions”: 帮助编译Angular应用程序的特殊编译器选项。

  10. “excludeDirectories”: 确定不应该被搜索的顶级目录。

  11. “excludeFiles”: 指定应该被忽略的文件。

  12. “includeDirectories”: 包含需要编译的文件的目录列表。

  13. “files”: 指定需要编译的特定文件。

compilerOptions

  1. target: 指定编译后代码的目标JavaScript版本,默认值是ES3。可选项包括:ES3、ES5、ES6/ES2015、ES2016、ES2017、ES2018、ES2019、ES2020、ES2021。

  2. module: 指定编译后代码使用的模块系统,默认值是None。可选项包括:CommonJS、AMD、System、UMD和ES6。

  3. lib: 指定编译过程中使用的内置类型定义库,默认值是空数组。常用的可选项包括:ES6/ES2015、ES2016、ES2017、ES2018、ES2019、ES2020、ES2021、Dom、WebWorker、ScriptHost、ESNext等。

  4. outDir: 指定编译输出目录。

  5. sourceMap: 是否生成对应的声明文件。

  6. removeComments: 是否在编译后移除代码中的注释。

  7. noImplicitAny: 是否在声明变量时必须给该变量明确的类型注解,如果不指定则会报错。

  8. strictNullChecks: 是否开启严格的null检查。

  9. esModuleInterop: 是否支持将CommonJS模块转换为ES6模块。

  10. allowJs: 是否允许编译JavaScript文件。

  11. jsx: 指定React使用的jsx版本。

  12. declaration: 是否生成声明文件。

  13. experimentalDecorators: 是否开启装饰器支持。

  14. noUnusedLocals: 是否检查未使用的本地变量。

  15. noUnusedParameters: 是否检查未使用的函数参数。

    1. noImplicitReturns: 是否检查函数是否有返回值。
  16. noFallthroughCasesInSwitch: 是否检查switch语句中的case是否都有break语句或者return语句。

  17. allowUnreachableCode: 是否允许有不可达代码。

  18. strict: 是否开启严格检查模式,包括strictNullChecks、strictFunctionTypes、strictPropertyInitialization、strictBindCallApply、alwaysStrict。

  19. moduleResolution: 模块解析策略,默认为Node,可选项为Node和Classic。

  20. baseUrl: 指定查找非相对模块的根目录。

  21. paths: 指定模块路径映射。

  22. rootDirs: 指定多个项目根目录。

  23. typeRoots: 指定类型定义文件的搜索目录。

  24. types: 指定要包含的类型定义文件。

  25. preserveConstEnums: 是否在编译过程中保留枚举值的常量性质。

  26. declarationDir: 指定生成声明文件的输出目录。

  27. sourceRoot: 指定源代码的根目录。

  28. mapRoot: 指定生成的source map文件的根目录。

  29. resolveJsonModule: 是否解析JSON模块。

  30. skipLibCheck: 是否跳过检查内置类型定义库。

  31. strictFunctionTypes: 是否开启函数类型检查,包括函数参数和返回值。

  32. strictPropertyInitialization: 是否检查属性是否被初始化。

  33. strictBindCallApply: 是否检查函数中使用的this是否正确绑定。

  34. alwaysStrict: 是否使用严格模式。

  35. importHelpers: 是否在生成的代码中使用帮助函数。

  36. inlineSourceMap: 是否在编译后将source map直接内联到生成的代码中。

  37. inlineSources: 是否在编译后将源代码直接内联到生成的代码中。

  38. tsBuildInfoFile: 指定生成的tsbuildinfo文件的路径。

  39. experimentalWatchApi: 是否开启实验性的watch API。

在Vue 3项目中,tsconfig.jsontsconfig.app.jsontsconfig.node.json有不同的配置方法和作用。 ### tsconfig.json tsconfig.jsonTypeScript项目的根配置文件,常作为基础配置或入口配置,通过`references`字段关联其他子配置(如tsconfig.node.jsontsconfig.app.json),实现多配置的统一管理。它本身可以没有太多具体配置,主要用于引入其他配置文件。示例如下: ```json { "files": [], "references": [ { "path": "./tsconfig.node.json" }, { "path": "./tsconfig.app.json" }, { "path": "./tsconfig.vitest.json" } ] } ``` 此配置文件没有具体的编译规则,只是将其他三个配置文件引入进来,起到统一管理的作用[^2][^3]。 ### tsconfig.app.json tsconfig.app.json用于定义项目中其他文件的ts编译规则,主要针对应用程序代码的TypeScript配置,比如Vue组件、浏览器环境。以下是一个示例: ```json { "extends": "./tsconfig.json", "compilerOptions": { "target": "ESNext", "module": "ESNext", "strict": true, "jsx": "preserve", "moduleResolution": "Node", "skipLibCheck": true, "esModuleInterop": true, "allowSyntheticDefaultImports": true, "sourceMap": true, "baseUrl": ".", "paths": { "@/*": ["src/*"] }, "lib": ["ESNext", "DOM"] }, "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"], "exclude": ["node_modules", "dist"] } ``` 在这个配置中,`extends`字段继承了tsconfig.json的配置,`compilerOptions`定义了编译选项,如目标版本、模块系统等。`include`指定了需要编译的文件,`exclude`指定了不需要编译的文件[^1][^3]。 ### tsconfig.node.json tsconfig.node.json专门用来配置vite.config.ts文件的编译规则,针对Node.js环境相关代码的TypeScript配置,如项目的构建脚本、服务端逻辑等。示例如下: ```json { "extends": "./tsconfig.json", "compilerOptions": { "target": "ESNext", "module": "CommonJS", "strict": true, "esModuleInterop": true, "skipLibCheck": true, "forceConsistentCasingInFileNames": true }, "include": ["vite.config.ts"] } ``` 同样,`extends`继承了tsconfig.json的配置,`compilerOptions`中的`module`设置为`CommonJS`,以适应Node.js环境。`include`指定了需要编译的文件为`vite.config.ts`[^1][^3]。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Gleason.

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值