tsconfig.json配置

周尛先森
913 阅读3分钟

image.png

携手创作，共同成长！这是我参与「掘金日新计划 · 8 月更文挑战」的第6天，点击查看活动详情


tsconfig.json

最近在升级老项目，引入了ts，少不了配置tsconfig.json，这里顺便整理下tsconfig.json配置项。

概述

如果一个目录下存在一个tsconfig.json文件，那么它意味着这个目录是TypeScript项目的根目录。 tsconfig.json文件中指定了用来编译这个项目的根文件和编译选项。 一个项目可以通过以下方式之一来编译：

使用tsconfig.json

  • 不带任何输入文件的情况下调用tsc，编译器会从当前目录开始去查找tsconfig.json文件，逐级向上搜索父目录。
  • 不带任何输入文件的情况下调用tsc，且使用命令行参数--project（或-p）指定一个包含tsconfig.json文件的目录。

当命令行上指定了输入文件时，tsconfig.json文件会被忽略。


配置参数

配置文件里有很多参数，具体场景有的确实还比较抽象，这里统一举例说明

这个tsconfig.json大体可以分为两个部分描述，第一部分是编译的规则配置(compilerOptions)，第二个部分是对哪些文件进行编译(files,include,exclude)

最常用的结构代码举例如下:

{
    "compilerOptions": {},
    "files": [], 
    "include": [],
    "exclude": [] 
}

compilerOptions

"compilerOptions"可以被忽略，这时编译器会使用默认值。在这里查看完整的编译器选项列表。

files

用法很简单，就是个数组，里面的元素为待编译的ts文件， "files"指定一个包含相对或绝对文件路径的列表。 "include"和"exclude"属性指定一个文件glob匹配模式列表。 支持的glob通配符有：

  • * 匹配0或多个字符（不包括目录分隔符）
  • ? 匹配一个任意字符（不包括目录分隔符）
  • **/ 递归匹配任意子目录

如果一个glob模式里的某部分只包含*或.*，那么仅有支持的文件扩展名类型被包含在内（比如默认.ts，.tsx，和.d.ts， 如果 allowJs设置能true还包含.js和.jsx）。

如果"files"和"include"都没有被指定，编译器默认包含当前目录和子目录下所有的TypeScript文件（.ts, .d.ts 和 .tsx），排除在"exclude"里指定的文件。JS文件（.js和.jsx）也被包含进来如果allowJs被设置成true。 如果指定了 "files"或"include"，编译器会将它们结合一并包含进来。 使用 "outDir"指定的目录下的文件永远会被编译器排除，除非你明确地使用"files"将其包含进来（这时就算用exclude指定也没用）。

include && exclude

当文件有很多的时候，就可以用include和exclude(当然也可以不用)结合使用，比如现在只想让src下的除了带except文件编译，

几个常用的编译选项

allowJs
--allowJsbooleanfalse允许编译javascript文件。
checkJs
--checkJsbooleanfalse在 .js文件中报告错误。与 --allowJs配合使用。
declaration
--declaration -dbooleanfalse生成相应的 .d.ts文件。
module
--module -mstringtarget === "ES6" ? "ES6" : "commonjs"指定生成哪个模块系统代码：
 "None"， "CommonJS"， "AMD"，
 "System"， "UMD"， "ES6"或 "ES2015"。
只有 "AMD"和 "System"能和 --outFile一起使用。
 "ES6"和 "ES2015"可使用在目标输出
为 "ES5"或更低的情况下。
outDir
--outDirstring重定向输出目录。
outFile
--outFilestring将输出文件合并为一个文件。合并的顺序是根据传入编译器的
文件顺序和 ///<reference``>和 import的文件顺序决定的。
查看输出文件顺序文件了解详情。
avatar
文章
阅读
粉丝