使用webstorm调试node程序

前言

相信你们接触过很多node代码了，若是你应用的比较初级或者针对你的项目不须要接触过深的node代码，也许你仅仅须要简单的console.log('your variable')就彻底知足你的须要了。若是你应用node比较深刻，想要调试（debug）之，我想你应该接触过node-inspector，大体用法流程，简单以下——

1.安装：npm install -g node-inspector
2.启动debug模式（单独命令行）：
    node-debug &（该命令默认8080端口）
    node-debug --web-port 1984 （定义任意端口）
3.访问chrome debug devTools
　　路径如：http://127.0.0.1:1984/?ws=127.0.0.1:1984&port=5858
4.启动gulp或者grunt服务（具备gulp或者grunt任务时）
　　node --debug-brk $(which grunt) server （这种模式使用在第一次初始化执行的代码）
　　node --debug $(which grunt) server（这种模式使用在初始化以后监听的node代码）

调试面板与chrome developer tools基本一致，很熟悉，知道怎么使用chrome的，都知道怎么玩儿好它，没什么学习成本。

在这里，主要介绍一下使用webstorm去调试node代码，以前在网上各类搜索了一番，不是很靠谱，因此，本身多作了些尝试与思考，在这儿汇总总结，但愿能够帮助到使用webstorm的同窗。

若是你不知道webstorm，好吧，看看官方介绍吧。对于编辑器的选择，每一个人都有不一样观点，在此不讨论。只是我的用过eclipse（aptana）、sublime text、webstorm，一步步小小进阶，便对webstorm爱不释手了，功能很是强大，集成度确实比较高。基本的用法有机会再详细讨论，这里只介绍若是调试node程序。

若是你玩儿过java，使用eclipse调试起来，确实方便。或者你玩儿php，相信phpstorm调试php代码也很是不错。若是有个IDE一样可以调试Node，那就太赞了。没错，一个webstorm搞定这些。

主要按照以下目录介绍——

1.调试nodejs程序——常规用法（run/debug模式）、调试面板等介绍
2.调试gulp/grunt
3.调试web应用

 

1.调试nodejs程序

以下图——

能够看到在23行打了一个断点。想要断点起做用，那么须要对该文件作debug配置——

Run模式，直接运行该文件，不会对断点起做用，此时，能够经过打日志（console.log）的方式进行调试，它会顺序执行该js文件，并不须要有入口方法或者入口类等等（不一样于java）。

接下来可进行配置——

点击“Debug”以后，会看到——

就能够看到，代码debug于23行了。同时在下方的Debug面板中，可以看到Debug toolbar和Stepping toolbar，至于两个toolbar的说明，看看官方IntelliJ IDEA的说明便可，附上连接地址：http://www.jetbrains.com/idea/help/debug-tool-window.html

启动debug，更便捷的方式，就是该文件右键后，选在debug便可。看下图——

以上，能够调试简单的node程序代码，操做很简单，也很方便。接下来，看看如何调试gulp任务（grunt相似，就不列举了）。

 

2. 调试gulp

在对应的gulpfile.js文件上面，右键便可，以下图——

选择“Create 'clean'”用来添加配置并启动debug；若选择“Debug 'clean'”能够直接进行调试。

若是你的任务并无在gulpfile.js文件中声明，一样能够打开配置对话框进行配置，以下：

注意在gulpfile.js内部进行操做，它须要加载全部的任务名称，这样调试才会有效。会看到调试页面以下——

如上图，咱们看见了程序走到50行断点处，承接以上，继续说一下如何调试web应用。

 

3.调试web应用

如上图，咱们已完成gulp任务的断点调试的配置（针对非gulp任务的普通node程序，一样如是），当web进行访问时，天然会再对应断点处停下，如——

也能够看到对应浏览器一直处于加载状态，以下图——

若是想要对request对象中传递的参数进行查看的话，如——

OK，调试web应用介绍到这儿。

 

从各个应用分类（node普通程序调试、gulp/grunt任务调试、web调试等）的角度，对应的调试的配置及方法介绍到这儿。比较简单、便捷。

但愿读到这篇文章的你，能够试试webstorm，或许你也会爱上它。