安装
根据文档, 建议使用全局安装或使用与TypeScript兼容的编译器.
$ yarn global add typescript
yarn global v1.22.5
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed "typescript@4.0.5" with binaries:
- tsc
- tsserver
Done in 5.54s.
安装了tsc和tsserver两个命令, tsc我等皆知, 但tsserver是何物?
TypeScript独立服务器（aka tsserver）是一个Node.js可执行文件，封装了TypeScript编译器和语言服务，并通过JSON协议公开它们。tsserver非常适合编辑器和IDE支持。
编译
tsc
使用tsc --locale zh-CN --help或者tsc --locale zh-CN --all查看中文帮助文档:
-w, --watch 监视输入文件。
--pretty 使用颜色和上下文风格化错误和消息(实验)。
--all 显示所有编译器选项。
-v, --version 打印编译器的版本。
--init 初始化 TypeScript 项目并创建 tsconfig.json 文件。
-p, --project 文件或目录 编译给定了其配置文件路径或带 "tsconfig.json" 的文件夹路径的项目。
-b, --build 生成一个或多个项目及其依赖项。
-t, --target 版本 指定 ECMAScript 目标版本: "ES3" (默认)、"ES5"、"ES2015"、"ES2016"、"ES2017"、"ES2018"、"ES2019"、"ES202" 或 "ESNEXT"
-m, --module 种类 指定模块代码生成: "none"、"commonjs"、"amd"、"system"、"umd"、"es2015"、"es2020" 或 "ESNext"。
--lib 指定要在编译中包括的库文件。'es5' 'es6' 'es2015' 'es7' 'es2016' 'es2020' 'esnext' 'dom' 'dom.iterable' 'webworker'
--allowJs 允许编译 JavaScript 文件。
--jsx 种类 指定 JSX 代码生成: "preserve"、"react-native" 或 "react"。
-d, --declaration 生成相应的 ".d.ts" 文件。
--declarationMap 为每个相应的 ".d.ts" 文件生成源映射。
--sourceMap 生成相应的 ".map" 文件。
--outFile 文件 连接输出并将其发出到单个文件。
--outDir 目录 将输出结构重定向到目录。
--removeComments 请勿将注释发出到输出。
--noEmit 请勿发出输出。
--strict 启用所有严格类型检查选项。
--types 要包含在编译中类型声明文件。
通常配合tsconfig.json配置文件使用tsc命令:
tsc
tsc -b ./tsconfig.build.json
Webpack + ts-loader
ts-loader也可以读取tsconfig.json文件, 不过它调用了包typescript, 每个项目都安装一遍typescript是真的麻烦.
生成.d.ts文件, 但是js文件被webpack打包, 一个入口对应一个输出.
比起ts-loader, 我觉得babel更好一些.
Babel
Babel是一个非常流行的JavaScript转译器，它通过插件@babel/plugin-transform-typescript支持TypeScript文件。
不读取tsconfig.json文件, 不会生成.d.ts文件.
tsconfig.json
有意思的是, 该文件没有严格的json格式限制, 可以使用注释, 甚至可以全部加逗号.
继承一个配置文件:
{
"extends": "./tsconfig.json",
}