typescript的开发工具

现在typescript应用越来越多了，它最大的优势，就是可读性强。增加了很多语法检查，减少了代码误错率。
目前，我接解触的typescript工具主要有vscode, visual stduio 2017和webstorm

vscode

它的优点非常突出。首先是免费开源。每月都会有更新，功能越来越强大。用它来开发typescript工程，完全够用。像layabox和erget这两个游戏引擎的ide,就是基于vscode定制的。而且，它本身就是基于node开发，所以算是node的自扩展工具。它是typescript首选工具

visual studio 2017

在我心中，visual studio是宇宙无敌第一工具，能开发很多应用，手机跨平台应用不在话下，还有云应用。但是它太大了，离线英文安装包达30G，如果全部安装的话，我的120G的SSD小硬盘，完全不够用。试着用它开发typescript或js，比vscode强大不少。但是，它太大了，跑不起…

webstorm

这是一个基于instllij的开发工具，功能也很全面，对于typescript还有专门的支持。它是收费的，不便宜。体积也比vscode大很多。显示效果，没有vscode高大尚。

最后，各方考虑，还是推荐vscode

正题

创建node工程

//比如在d:\tmp创建一个目录 ts1
mkdir d:\tmp\ts1
cd d:\tmp\ts1
npm init  //按提示完成后，这完成node工程创建

增加typescript支持

//如果没有安装typescript，则用命令 npm install typescript  -g 安装
tsc -v //可以看到当前的版本
//在d:\tmp\ts1目录下面，输入
tsc --init
//完成后，就会生成一个tsconfig.json的文件
//最后
code . //用vscode打开当前目录
//在vscode，新建一个index.ts,
//增加下面一行
console.log('hello typescripit');
//在命令行下，输入tsc后，就会得到一个index.js，
//然后输入下面命令
node .
//就可以运行了
//或者在vscode下，按下ctrl_+ shift + b,会弹出任务菜单项，选择Tsc编译，
//然后再配置vscode运行，就可以按F5调试并运行了。

一些问题解决

增加代码提示

好像从vscode 1.8后，就不使用了typing了，改使用@types了。在编写typescript的时候，如果要用到node自带的fs，或http等模块，用import后会有错误提示，那是因为没有安装@types

//在命令提示符下：
npm install @types/node@6.x   //我这里用的是node 6.x
//完成后，就可以愉快的使用node的模块的代码提示了

划分目录

默认的情况下，ts和js都是在一起的，生成发布版本的时候，就会有些乱了。所以，将所有生成的代码，放到别的目录。 
打开tsconfig.js 
找到compilerOptions中的outDir，增加./build,这样就会将代码生成到build里面了，然后修改package.json，修改main为build/index.js就可以运行了。 
默认的情况下， 
“allowJs”: true, /* Allow javascript files to be compiled. */ 
表示会把代码js文件，一起编译到build下 
这样代码，就会好多了：）

去除同名js

在没有划分目录的情况下，基于ts生成的js和ts是在同一个目录的，结果在vscode文件列表都会显示，这个vscode设置一下就可以了。 
Vscode->File->首选项->设置 
增产加 “*/.js”: { “when”: “$(basename).ts” },就可以了，下面是具体配置的例子

 "files.exclude": {
 "**/.git": true,
 "**/.svn": true,
 "**/.hg": true,
 "**/CVS": true,
 "**/node_modules":true,
 "**/typings":true,
 "**/logs":true,
 "**/*.js": { "when": "$(basename).ts" },
 "**/**.js": { "when": "$(basename).tsx" },
 "**/.DS_Store": true
 },