Skip to content

TypeScript 安装

前提条件

在安装 TypeScript 之前,你需要先安装 Node.js。Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,它包含了 npm(Node 包管理器),我们将使用 npm 来安装 TypeScript。

安装 Node.js

  1. 访问 Node.js 官方网站
  2. 下载并安装适合你操作系统的 Node.js 版本(建议选择 LTS 版本)
  3. 安装完成后,打开命令行工具,运行以下命令验证安装:
bash
node -v
npm -v

如果能够显示版本号,说明 Node.js 和 npm 安装成功。

安装 TypeScript

全局安装

使用 npm 全局安装 TypeScript:

bash
npm install -g typescript

项目本地安装

如果你只想在特定项目中使用 TypeScript,可以在项目目录中本地安装:

bash
cd 你的项目目录
npm install --save-dev typescript

验证安装

安装完成后,运行以下命令验证 TypeScript 是否安装成功:

bash
tsc --version

如果能够显示 TypeScript 的版本号,说明安装成功。

基本使用

编译 TypeScript 文件

创建一个名为 hello.ts 的文件,内容如下:

typescript
function sayHello(name: string) {
  return `Hello, ${name}!`;
}

let message = sayHello("TypeScript");
console.log(message);

然后运行以下命令编译这个文件:

bash
tsc hello.ts

这会生成一个 hello.js 文件,然后你可以运行这个 JavaScript 文件:

bash
node hello.js

输出应该是:

Hello, TypeScript!

配置文件

TypeScript 使用 tsconfig.json 文件来配置编译选项。你可以通过以下命令生成一个默认的 tsconfig.json 文件:

bash
tsc --init

生成的 tsconfig.json 文件包含了各种编译选项,你可以根据需要进行修改。

常用配置选项

json
{
  "compilerOptions": {
    "target": "es2016", // 编译目标 ECMAScript 版本
    "module": "commonjs", // 模块系统
    "esModuleInterop": true, // 启用 ES 模块互操作性
    "forceConsistentCasingInFileNames": true, // 强制文件名大小写一致
    "strict": true, // 启用所有严格类型检查选项
    "skipLibCheck": true // 跳过库文件的类型检查
  }
}

编辑器配置

VS Code

VS Code 是一个非常适合 TypeScript 开发的编辑器,它内置了 TypeScript 支持。

  1. 安装 VS Code:访问 VS Code 官方网站 下载并安装
  2. 安装 TypeScript 扩展:VS Code 已经内置了 TypeScript 支持,但你可以安装一些额外的扩展来增强开发体验,如:
    • ESLint
    • Prettier
    • TypeScript Hero

其他编辑器

如果你使用其他编辑器,如 Sublime Text、Atom 或 WebStorm,也可以安装相应的 TypeScript 插件来获得更好的开发体验。

在线编辑器

如果你不想在本地安装 TypeScript,也可以使用在线编辑器来学习和测试 TypeScript 代码,如:

这些在线编辑器提供了一个方便的环境来编写和运行 TypeScript 代码,无需本地安装。

总结

TypeScript 的安装非常简单,主要步骤是:

  1. 安装 Node.js
  2. 使用 npm 安装 TypeScript
  3. 验证安装
  4. 配置编译选项
  5. 设置编辑器

现在你已经成功安装了 TypeScript,可以开始学习 TypeScript 的特性和语法了!