TypeScript 安装及基础运行环境搭建

安装 TypeScript

npm install -g typescript

安装成功后，命令行输入 tsc -v 命令提示当前安装的 TypeScript 版本：

出现版本号即安装成功。

使用 VSCode 编译 .ts 文件

首先，我们编写一个简单的 .ts 文件，如图

在控制台切换到对应文件夹，输入 tsc index.ts。

此时文件夹下将会编译出一个 index.js 文件。

这样，ts 文件编译成浏览器能运行的 es5 的 js 文件就成功了。

简化流程

如果每次都手动运行一遍编译命令很麻烦，下面我们来使用自动编译。

• 首先，在文件夹输入命令 tsc --init

• 会自动创建一个 tsconfig.json 文件

• 打开此文件，寻找 outDir 字段

　　

• 将这一行注释解开，将 "./"修改为"./js"，保存

• 这代表着将编译的 .js 文件输出到当前目录下的 js 文件夹中，此文件夹会在有文件编译时自动创建

• 保持终端在当前项目目录（当前文件夹）

• 点击顶部工具栏中的 终端 --运行任务--typescript--tsc监视

　　

此时，tsc 便处于监视状态，将 .ts 文件保存后会自动编译到 js 文件夹的 index.js 中，完成。