VS Code搭建Ts环境

搭建TypeScript环境

1. 下载node.js（以便使用ts编译器），下载好后双击，傻瓜式安装。
   node.js下载地址：下载LTS版本
   VS Code 下载地址
2. cmd打开输入node -v，显示node版本，说明安装成功。
   
3. 使用npm全局安装TypeScript
   • cmd打开输入npm install -g typescript
   • 输入tsc -v查看是否安装成功
     
4. 新建一个文件夹存放你的ts项目，打开vscode，File–>Open Folder–>选择刚刚创建的文件夹，点击图片中圈出来的图标，新建一个ts文件。
   
   
5. 在ts文件中敲入console.log("hello,typescript!")，进行测试。
   
6. 打开终端，输入tsc index.ts，回车，会发现左边项目部分有一个转换后的js文件，至此，一个简单的ts文件编译好了。如果显示在此系统上禁止运行脚本，按照这篇博客的方法就可以解决了。
   
   

自动实时编译

1. 如果我在index.ts中添加了一些代码的话，此时不会即时编译成js文件，还是要手动在控制台输入tsc index.ts才能进行编译，非常不便，所以我们要让TypeScript自动监视文件修改并自动编译。首先进入项目所在目录，打开cmd，输入tsc --init，回车，可以发现目录下多了一个tsconfig.json文件。
   
   

2. 当前ts和js文件是在同一目录下，我们可以通过修改tsconfig.json文件来控制js文件的输出目录，打开tsconfig.json文件，修改如下所示，保存，这样我们在 ./src 中编码 .ts 文件，.ts 文件编译成 .js 后，输出到 ./build 中。
   

3. 删除之前写的ts和js文件，重新创建ts文件，写入相应语句，按下快捷键Ctrl+Shift+B，会看到有两个选项，选择tsc:watch - tsconfig.json监视模式即可，一旦更新ts文件，保存时就会自动编译成js文件。