一直喜欢vscode这个编辑器,今天看在liaoxuefeng.com学习nodejs时,看到上面
讲了使用vscode配合nodejs调试JS代码,原来这么简单,现在分享如下:

本人环境:

  • Visual Studio Code 1.14.2
  • Node.js 6.11.2
  • Windows10 64位

上述两个软件都非常容易安装,基本上就是官网下载安装包,双击安装即可。

配置步骤

步骤1
新建个文件夹比如test,在里面放一个JS文件比如hello.js,把这个文件假拖放到vscode
窗口中打开,在里面随便写一点测试代码,完成后像下面这样

步骤2
点击左边第4个虫子按钮(Debug),这时候看到左上角三个小图标,其中绿色小三角表示开始调试
接着是打开调试配置文件打开输出窗口

步骤3
点击齿轮小图标打开launch.json文件,如果出现让你选择运行环境,直接选nodejs(电脑里需
装有nodejs才行),如果你使用的vscode版本大于等于我的版本,无需对launch.json进行更改,
保持默认即可。我的launch.json配置文件如下。

可以在项目目录看到vscode自动新建了1个.vscode文件夹,里面放有launch.json文件
如果使用的vscode版本比我的低,可能需要对launch.json文件进行修改,具体可以参考:
liaoxuefeng.com 网站上的教程

步骤4
配置好launch.json之后,直接单击绿色小三角图标JS文件就运行了。这时候应该会自动弹出
输出窗口,如果没有可以手动打开输出窗口查看结果。

每次运行完毕最好点击红色小方块结束运行
点击代码编号左边的空白,即可启动断点调试

Visual Studio Code 配合 Node.js 轻松实现JS断点调试的更多相关文章

  1. 用Visual Studio Code写Node.j

    介绍 vsc的宣传语是: 一个运行于 Mac OS X.Windows和 Linux 之上的,针对于编写现代 Web 和云应用的跨平台源代码编辑器. 按它说的,vsc特别适合来作为前端开发编辑器. 内 ...

  2. 用Visual Studio Code写Node和调试代码

    介绍 vsc的宣传语是: 一个运行于 Mac OS X.Windows和 Linux 之上的,针对于编写现代 Web 和云应用的跨平台源代码编辑器. 按它说的,vsc特别适合来作为前端开发编辑器. 内 ...

  3. 总结在Visual Studio Code创建Node.js+Express+handlebars项目

    一.安装node.js环境. Node.js安装包及源码下载地址为:https://nodejs.org/en/download/ 32 位安装包下载地址 : https://nodejs.org/d ...

  4. 总结在Visual Studio Code运行node.js项目遇到的问题

    一.cannot find module “lodash” 项目运行时出现以下错误: Error: Cannot find module 'lodash' at Function.Module._re ...

  5. Visual Studio Code - 调试 Node.js 代码

    官方的文档写的太好了!大家还是看参考资料吧. 参考资料: Debugging in Visual Studio Code Debug Node.js Apps using Visual Studio ...

  6. Nodejs in Visual Studio Code 04.Swig模版

    1.开始 设置Node_Global:npm config set prefix "C:\Program Files\nodejs" Express组件:npm install e ...

  7. Nodejs in Visual Studio Code 01.简单介绍Nodejs

    1.开始 作者自己:开发人员,Asp.Net , html / js , restful , memcached , oracle ,windows , iis 目标读者:供自己以后回顾 2.我看No ...

  8. crossplaform---Nodejs in Visual Studio Code 04.Swig模版

    1.开始 设置Node_Global:npm config set prefix "C:\Program Files\nodejs" Express组件:npm install e ...

  9. crossplatform---Nodejs in Visual Studio Code 01.简单介绍Nodejs

    1.开始 作者自己:开发人员,Asp.Net , html / js , restful , memcached , oracle ,windows , iis 目标读者:供自己以后回顾 2.我看No ...

随机推荐

  1. 谈谈对MVC、MVP和MVVM的理解

    刚出来工作的时候维护过一个老系统,该系统是用微软的ASP(Active Server Pages 动态服务器页面)写的.每一个页面都是一个ASP文件,每一个一个ASP文件中又同时包含了HTML.CSS ...

  2. js 控制按钮点击后不可用

    <input type="button" id="btn" value="免费获取验证码" /> <script type ...

  3. 第一百四十五节,JavaScript,同步动画

    JavaScript,同步动画 将上一节的,移动透明动画,修改成可以支持同步动画,也就是可以给这个动画方法多个动画任务,让它同时完成 原理: 向方法里添加一个属性,这个属性是一个对象,同步动画属性,属 ...

  4. "回车"(carriage return)和"换行"(line feed)

    “回车”(carriage return)和“换行”(line feed)这两个概念的来历: 在计算机还没有出现之前,有一种叫做电传打字机(Teletype Model 33)的玩意,每秒钟可以打10 ...

  5. 2018 CCPC 桂林游记

    TYPE: Onsite Contest NAME: 2018 - CCPC - Guilin PLAT: HUSTOJ TIME: 2018/10/28 09:00-14:00 CST LOCA: ...

  6. hdu 3835:R(N)(水题,数学题)

    R(N) Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  7. hdu 4289(最小割)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4289 思路:求最小花费,最小割应用,将点权转化为边权,拆点,(i,i+n)之间连边,容量为在城市i的花 ...

  8. React资料

    基于ReactNative开发的APPhttp://reactnative.cn/cases.htmlhttp://www.cnblogs.com/qiangxia/p/5584622.html F8 ...

  9. PowerDesigner使用教程3

    from:http://www.cnblogs.com/langtianya/archive/2013/03/08/2949118.html PowerDesigner是一款功能非常强大的建模工具软件 ...

  10. UIImagePickerController在UIPopoverController中 旋屏问题

    1弧度=180/π度1度=π/180弧度今天遇到了 一个问题.UIImagePickerController在UIPopoverController中 旋屏问题. 在查找了许多资料后方知,此乃iOS系 ...