TypeScript 安装与配置

安装 TypeScript

安装 TypeScript 最简单的方式是通过 npm(Node.js 包管理器)进行全局安装。打开终端,执行以下命令:

npm install -g typescript

安装完成后,可以通过tsc -v命令检查 TypeScript 的版本,确保安装成功。

配置文件 tsconfig.json

在使用 TypeScript 进行开发时,我们通常需要创建一个tsconfig.json文件来配置 TypeScript 编译器的行为。该文件指定了编译 TypeScript 代码时的各种选项。

tsconfig.json的主要作用包括:

1. 指定待编译的 TypeScript 文件或目录。
2. 配置编译选项,如目标 JavaScript 版本、模块系统、严格类型检查等。
3. 设置编译输出目录和文件名。
4. 引入其他配置文件或扩展配置。

以下是一些常用的tsconfig.json配置项:

• compilerOptions: 编译器选项,包含各种编译相关的配置。
  • target: 指定编译后的 JavaScript 版本,如es5、es6等。
  • module: 指定生成的模块系统,如commonjs、es2015等。
  • strict: 启用所有严格类型检查选项。
  • outDir: 指定编译输出目录。
  • rootDir: 指定编译的根目录。
• include: 指定要编译的文件或目录列表。
• exclude: 指定要排除的文件或目录列表。

示例tsconfig.json文件:

{
  "compilerOptions": {
    "target": "es6",
    "module": "commonjs",
    "strict": true,
    "outDir": "dist",
    "rootDir": "src"
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "**/*.spec.ts"]
}

开发环境配置

为了提高开发效率和代码质量,我们通常使用集成开发环境(IDE)来编写 TypeScript 代码。以下是在 VS Code 中配置 TypeScript 开发环境的步骤:

1. 安装 VS Code 编辑器。
2. 在 VS Code 中安装 TypeScript 扩展:
   • 点击 VS Code 左侧的扩展图标。
   • 在搜索框中输入"TypeScript"。
   • 选择"TypeScript"扩展并点击安装。
3. 在项目根目录下创建tsconfig.json文件,配置编译选项。
4. 使用 VS Code 打开 TypeScript 项目。
5. 编写 TypeScript 代码,VS Code 会自动提供语法高亮、智能提示和错误检查等功能。

除了 IDE,我们还可以使用 TypeScript 编译器tsc来编译 TypeScript 代码。常用的编译器选项包括:

• tsc: 编译当前目录下的所有 TypeScript 文件。
• tsc <file>: 编译指定的 TypeScript 文件。
• tsc --init: 生成默认的tsconfig.json文件。
• tsc --watch: 监视文件变化并自动编译。