TypeScript - 环境搭建与编译
[TOC]
学习目标
- 学会环境搭建
- 掌握 TypeScript 代码的编译与运行
TypeScript 环境搭建
TypeScript 编写的程序并不能直接通过浏览器运行，我们需要先通过 TypeScript 编译器把 TypeScript 代码编译成 JavaScript 代码
TypeScript 的编译器是基于 Node.js 的，所以我们需要先安装 Node.js
Node.js 安装
安装完成以后，通过 终端或者 cmd 等命令行工具来调用 node
node -v
通过 NPM 包管理工具安装 TypeScript 编译器
http://www.typescriptlang.org/
npm install -g typescript
TypeScript 编译器 安装成功以后，会提供一个 tsc 的命令，用于编译我们的 TypeScript 代码文件
tsc -v
如果大家对 node 和 npm 等知识点有疑问或者想深入了解的，我们其它课程中有针对它们的更详细更深入的内容，可以咨询我们t s的课程顾问进行了解
TypeScript 编译
TypeScript 代码
let str: string = 'ts';
编译 TypeScript 代码
tsc <要编译的ts文件>
默认情况下会在当前文件所在目录下生成同名的 js 文件
编译选项
编译命令 tsc 还支持许多编译选项，我们先来了解其中几个，后续我们在具体有需求的时候再去了解更多的。
--outDir
指定编译文件输出目录
tsc --outDir ./dist ./src/HelloTypeScript.ts
--target
指定编译的代码版本目标，默认为 ES3
tsc --outDir ./dist --target ES6 ./src/HelloTypeScript.ts
--watch
在监听模式下运行，当文件发生改变的时候自动编译
tsc --outDir ./dist --target ES6 --watch ./src/HelloTypeScript.ts
通过上面几个例子，我们基本可以了解 tsc 的使用了，但是大家应该也发现了，如果每次编译都输入这么一大堆的选项是真的很繁琐。
其实，TypeScript 编译为我们提供了一个更加强大且方便的方式，编译配置文件：tsconfig.json，我们可以把上面的编译选项保存到这个配置文件中
编译配置文件
{
"compilerOptions": {
"outDir": "./dist",
"target": "ES2015",
"watch": true,
},
"include": ["./src/**/*"]
}
include
指定需要编译的 ts 文件目录，如果没有指定，则默认包含当前目录及子目录下的所有 ts 文件
默认配置
tsc 默认会从当前目录开始去查找 tsconfig.json 文件，如果没有找到，会逐级向上搜索父目录
tsc
指定配置文件
使用 --project 或 -p 也可以指定某个具体的配置文件
tsc -p ./c.json
指定配置文件目录
使用 -p 指定配置文件所在目录，tsc 会默认加载该目录下的 tsconfig.json 文件
tsc -p ./src
后面我们还会讲到更多的关于编译的操作，现在先让我们看一下上面这个例子，大家可以发现在我们原先的 ts 文件中有这么一段代码 : string，而编译后的 js 文件是没有的，那么这是什么呢？其实这个就和我们上面提到的类型系统有关系了，下面就让我们来具体看一下类型系统到底是这么回事，它能帮助我们解决什么问题！
除了以上配置，ts 的编译配置选项还有很多，在后面的学习过程中，根据需要在逐一讲解，并且在最后章节中还会对所有的配置选项进行统一总结
更多编译选项：
http://www.typescriptlang.org/docs/handbook/tsconfig-json.html
http://www.typescriptlang.org/docs/handbook/compiler-options.html
总结
- 环境搭建
- 编译命令与配置
- 配置文件：tsconfig.json
- outDir、target、watch、include、project
