前言
在前端开发过程中，我们经常会用到 TypeScript 进行开发。而使用 TypeScript 的基础条件之一就是要有一个合适的 tsconfig.json 文件，以配置 TypeScript 的编译选项。在这里，我们将介绍一个优秀的 npm 包 @jedmao/tsconfig，它可以为我们提供一个合适的默认的 tsconfig.json 文件，并且还会提供一些前端开发中常用的配置选项。
1. 安装 @jedmao/tsconfig
使用 npm 安装 @jedmao/tsconfig：
npm install --save-dev @jedmao/tsconfig
2. 引用 @jedmao/tsconfig
在项目的根目录下，创建一个 tsconfig.json 文件，使用 extends 选项引用 @jedmao/tsconfig。例如：
{
"extends": "@jedmao/tsconfig"
}这样，@jedmao/tsconfig 中的编译选项就会被继承到我们的项目中。
3. 使用 @jedmao/tsconfig
@jedmao/tsconfig 中定义了一些常用的编译选项，使得我们在编写 TypeScript 代码时更加方便。下面就是一些常用的编译选项：
3.1 module
module 选项指定了输出的模块类型，默认是 "CommonJS"，可以配置成 "ESNext"、"UMD"、"AMD"、"System" 等。
3.2 target
target 选项指定了编译后 JavaScript 代码的目标版本，默认是 ES3，可以配置成 ES5、ES2015、ES2016、ES2017 等。
3.3 lib
lib 选项指定 TypeScript 应该包含哪些别的库的定义文件，默认是包含所有库的定义文件。常用的包括 DOM、ES5、ES6、ES7、ESNext、WebWorker、WebWorker.importScripts 等。
3.4 outFile
outFile 选项指定编译后的 JavaScript 文件的输出路径和文件名。
3.5 declaration
declaration 选项指定是否需要生成声明文件，生成的声明文件通常以 ".d.ts" 扩展名作为文件名后缀。
3.6 sourceMap
sourceMap 选项指定是否需要生成源映射文件，生成的源映射文件通常以 ".js.map" 扩展名作为文件名后缀。
3.7 exclude
exclude 选项指定哪些文件不需要被编译，默认包含 "node_modules" 目录和 ".spec.ts" 扩展名的文件。
3.8 include
include 选项指定需要被编译的文件，默认包含 "./src" 目录。
4. 示例代码
下面是一个例子，它展示了如何使用 @jedmao/tsconfig：
-- -------------------- ---- ------- - ----------- ------------------- ------------------- - ----------- --------- ----------- --------- -------- - --------- -------- ---- ------------ ----------------------- ---------------- ----- -------------- ---- --- ----------- - ----------- ------------------- --------------- --- ----------- - ----------------- -- -
在这个例子中，我们指定了输出模块类型为 "ESNext"，编译后的 JavaScript 代码的目标版本为 ES2015，包含了 DOM 和 ES6 这两个库的定义文件，在 "./dist/javascript.js" 处生成编译后的文件和声明文件并生成源映射文件，不包含 "./test" 和 "./node_modules" 目录，而 "./src" 目录下所有的 ".ts" 文件都将被编译。
结语
使用 @jedmao/tsconfig 可以非常方便地完成 TypeScript 的配置。当然，我们也可以在 @jedmao/tsconfig 基础上自定义适合自己的 tsconfig.json 文件。这样，在我们日常的前端开发中，将会更加轻松愉快。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f0575fa403f2923b035bee5