WebStrom + TypeScript

背景

最近公司用 TypeScript 开发前端。虽然我负责后台的工作，但也需为前端提供意见，为了不盲目提意见，因此来简单了解下 TypeScript

安装配置环境

1. 安装 node.js 

    TypeScript 是在 node.js 的环境上，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 已经提供自动编译的功能了，只是需要设置一下。 

File -> setting

如果不勾选此项，在代码发生变动时，会有提示，是否要编译

我这边选择了自动编译功能，下面就去尝试第一份代码吧

测试

创建空项目：TypeScriptProgram

File -> New -> Project 

右键此项目，创建 tsconfig.json File

添加 ts 文件

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

let user = "Jane User";

document.body.innerHTML = greeter(user);

保存后，自动生成相应的 js 文件

到此，用 WebStrom 开发 TypeScript 的环境已准备好了。