原文地址 https://github.com/xiadd/blog/issues/8

这两天在看ts,也在入门中, 网上大部分教程都是前端配置ts开发调试,这个也有很多相当成熟的实践教程, 这篇文章主要是nodejs的ts配置, 说起来也是相当简单的, 不涉及任何ts的语法与概念, 同时也可以根据本文配置es6的nodejs开发环境(主要是模块部分).

ts-node的使用

说起 babel-node 大家应该都挺熟悉了, ts-node是一个类似的工具,可以在不编译的情况的执行ts文件,方便我们开发, 当然是node环境下的.

安装

npm i -D typescript ts-node

创建app.ts文件:

//app.ts
console.log(1)

调用命令ts-node app.ts(全局安装的情况下), 如果一切正常的话,我们应该可以看到想要的输出了.

一直到上面都是常规话题, 没什么深入下去的意义. 下面讲到ts-node的调试

调试

根据nodejs官网 我们知道nodejs的调试方法有下面几种:

1. node-inspect 一个第三方开发的调试工具, 今天我们不涉及
2. chrome 开发者工具, 下面会讲到
3. vs code 今天的重点
4. vs
5. webstorm 也是相当方便的工具

vs code的调试

根据官网我们打开node的inspect模式(ts-node同样可以)ts-node --inspect app.js, 应该可以看到类似的的提示:

这样表示已经可以进行调试了, 但是貌似不可以进行打断点之类的操作, 这个就要借助vscode了.

打开vscode debug面板增加调试选项, 选择attach to progess:

然后点击debug, 会弹出类似下面的弹窗:

注意红框, 会有几个node进程, 选择带inpect的那个进程, 如果一切进行的正常的话就可以进行调试了:

chrome 开发者工具

这个更加简单, 在任意网页打开开发者工具, 我们可以看到如图

点击node图标同样可以进行调试:

但是貌似不是很稳定, 经常崩溃, 而且windows上也有问题.

最后是个示例: https://github.com/xiadd/node-ts

感兴趣可以star