创建 TypeScript 的配置文件 tsconfig.json
npx tsc --init
tsconfig.json 文件基础结构
{"compilerOptions": {"target": "ES2022","module": "ES2022","moduleResolution": "node10","strict": true,"esModuleInterop": true,"forceConsistentCasingInFileNames": true,"outDir": "./dist","rootDir": "./src","sourceMap": true,"skipLibCheck": true},"include": ["src"],"exclude": ["node_modules", "dist"]
}主要配置说明：
| 配置 | 说明 |
|---|---|
| target | 生成的 JavaScript 版本，选项如下： ES3：适用于老旧浏览器，如 IE6-IE8。 ES5：兼容性好，适用于大多数现代浏览器（IE9+）。 ES6 / ES2015、ES2016、ES2017、ES2018...ES2024等。 ESNext：始终使用最新的 ECMAScript 版本。 |
| module | 指定模块化的方式，选项如下： None: 不使用模块化。 如果你是Node.js+TypeScript+ES6+(例如ES2022)环境，那么就选择ES2022 |
| strict | 是否使用TypeScript 的严格类型检查。true：启用，false：不启用。 |
| esModuleInterop | 是否允许 TypeScript 兼容 CommonJS 模块与 ECMAScript 模块的导入。 |
| forceConsistentCasingInFileNames | 是否强制确保文件名的大小写一致。 |
| outDir | 指定编译后的 JavaScript 文件存放的目录。 |
| rootDir | 指定 TypeScript 编译器查找输入文件的根目录。它定义了源代码的根目录，编译器会相对于这个目录编译文件并保持目录结构。编译时会以该目录为基准，生成对应的输出文件。 |
| sourceMap | 生成源映射文件。启用该选项后，编译器会生成 .map 文件，这些文件将 JavaScript 代码与原始 TypeScript 代码关联起来，有助于调试。这样，在浏览器或调试器中调试时，可以直接查看 TypeScript 源代码，而不是编译后的 JavaScript 代码。 |
| skipLibCheck | 跳过对库文件（如 node_modules 中的声明文件）进行类型检查。这可以加速编译过程，尤其是在大型项目中，尽管这可能会导致某些库文件的类型错误无法被检测到。除非你有性能需求，不然建议关闭这个选项。 |
| include | 指定哪些文件或目录应该被 TypeScript 编译。它是一个包含文件路径的数组，可以指定具体的文件或文件夹。 |
| exclude | 指定哪些文件或目录应该从编译过程中排除。与 include 相反，exclude 列出了不需要编译的文件或目录。 |
| baseUrl | 指定模块解析的根目录。设置了 baseUrl 后，你可以使用相对路径的方式导入模块，避免过多的 ../../ 这样的路径。 |
| paths | 指定模块的别名或路径映射。通过与 baseUrl 配合使用，允许你为模块指定更简洁的导入路径，而不是使用相对路径。 |
| moduleResolution | 控制 TypeScript 如何解析模块，选项如下： node：遵循 Node.js 模块解析规则。 |
| resolveJsonModule | 导入 JSON 文件，true：允许，false：不允许 |
| noUnusedLocals | 检测未使用的局部变量，true：检测，false：不检测 |
| noUnusedParameters | 检测未使用的函数参数，true：检测，false：不检测 |
| strictPropertyInitialization | 确保类属性在构造函数中被正确初始化，true：检测，false：不检测 |
TypeScript 编译
在 tsconfig.json 配置完成后，可以使用 tsc 进行编译，会读取 tsconfig.json 并进行编译，生成 .js 文件
npx tsc
如果想让 TypeScript 自动编译，可以使用 --watch 模式，TypeScript 代码一旦修改，编译器会自动重新编译。
# 自动编译
npx tsc --watch