背景

最近公司用 TypeScript 開發(fā)前端。雖然我負責后臺的工作，但也需為前端提供意見，為了不盲目提意見，因此來簡單了解下 TypeScript

安裝配置環(huán)境

1. 安裝 node.js 

    TypeScript 是在 node.js 的環(huán)境上，node.js 下載地址：https://nodejs.org/en/download/

2. 安裝 TypeScript 

    使用 Node 的 npm 命令安裝 TypeScript 編譯器，在 cmd 界面里輸入：

npm install typescript -g

    可通過 tsc 命令查看是否安裝成功

tsc -v

3. 安裝 WebStrom

    WebStrom 官方下載地址： https://www.jetbrains.com/webstorm/ 

WebStorm 自動編譯 TypeScript

下載的 2018.1.5 版本的 WebStorm 已經(jīng)提供自動編譯的功能了，只是需要設置一下。 

File -> setting

如果不勾選此項，在代碼發(fā)生變動時，會有提示，是否要編譯

我這邊選擇了自動編譯功能，下面就去嘗試第一份代碼吧

測試

創(chuàng)建空項目：TypeScriptProgram

File -> New -> Project 

右鍵此項目，創(chuàng)建 tsconfig.json File

添加 ts 文件

function greeter(person) {
    return "Hello, " + person;
}

let user = "Jane User";

document.body.innerHTML = greeter(user);

保存后，自動生成相應的 js 文件

到此，用 WebStrom 開發(fā) TypeScript 的環(huán)境已準備好了。