使用Webstorm调试nodejs项目

俗话说的好，“工欲善其事，必先利其器”，要想使用 Webstorm 更高效率的去开发 nodejs 项目，则必须要清楚如何使用 Webstorm 去调试我们的 nodejs 项目。在讲解如何调试 nodejs 项目之前，有必要先说说如何使用 Webstorm 去启动 nodejs 项目。

1.启动nodejs项目

启动一个 nodejs 项目可以直接通过在命令行输入：node ***.js 启动，而下面要介绍的是通过 IDE Webstorm 如何启动一个 nodejs 项目。

首先需要配置好相关信息，右上角打开 EditConfiguration :

添加一个 node.js:

在界面中输入如下信息：

name : 随便取
Node interpreter : 电脑上 node 安装路径
Working directory : 项目路径
Javascript file : 项目启动 js 文件，一般是项目根目录下的 app.js

保存，然后点击 Webstorm 右上角的三角形符号，会发现在正下方 run 控制台出现输出信息，并告知你服务已启动: http://localhost:3000，表明项目已启动。

2.调试nodejs项目

我们往往需要知道项目中的某个 function 可以一直追溯到何处，便可以通过打断点然后运行 debug 的形式追踪下去。这里要说明 webstorm 调试 nodejs 与 webstorm 调试 javascript 是完全不同的两个操作，相关配置也不同。我们知道调试 javascript 的另一种方式是可以通过浏览器直接调试，例如 chrome 浏览器下直接右键选择工具即可，或者使用键盘快捷键 command + option + i(Mac) 即可打开；而在 webstorm 中调试 javascript ，需要进行相关配置，选择 webstorm 右上角的 EditConfiguration ,在出现的界面中添加一个javascript debug:

配置相关信息:

需要填写：

name：随便取。
url：需要调试的 js 文件路径。

配置好后选择保存，在相关 js 文件中添加断点，然后选择右上角的 js debug 配置服务器，选择甲虫形状的 debug 按钮即可进行调试。
相比较起来，个人觉得浏览器中的调试更为方便，相关信息可参考如下链接:webstorm下调试javascript总结

我之前入的坑就是：明明是想要调试nodejs程序，结果看了好久的 webstorm 调试 js 的教程…

好了，说回正题，如何使用 webstorm 进行 nodejs 的相关调试呢？很简单，待完成了上述“ webstorm 启动 nodejs 项目”的配置后则无需再进行相关配置操作。只需在需要调试的地方打下断点，然后运行 webstorm 右上角 nodejs 服务器的甲虫形状的 debug 按钮即可:

正下方 debug 控制台出现输出信息，并告知你 local 服务已启动: http://localhost:3000 ,然后点进去通过浏览器进入到你的项目内部。待你运行到打断点处的功能时，浏览器会带你自动跳转回 webstorm 的 debug 控制台处，查看控制台的 debugger 选项，通过控制即可进行代码追踪。