原文:配置 VS Code 调试 JavaScript

1、 安装 Debugger for Chrome 扩展、Open in Browser  扩展、View In Browser 扩展

2、用vs code打开项目

3、按 F5 出现下拉列表,选择Chrome,如下图

4、修改生成的 launch.json 文件:

{

    "version": "0.2.0",

    "configurations": [

   {

       "type": "chrome",

       "request": "launch",

       "name": "Launch Chrome against localhost",

       "url": "http://localhost:8080",

       "webRoot": "${workspaceRoot}"

    }
}

  修改后

{
// 使用 IntelliSense 了解相关属性。
// 悬停以查看现有属性的描述。
// 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830387
"version": "0.2.0",
"configurations": [
{
"name": "Run app.js",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/app.js",
"stopOnEntry": false,
"args": [],
"cwd": "${workspaceRoot}",
"preLaunchTask": null,
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development"
},
"externalConsole": false,
"sourceMaps": false,
"outDir": null
}
]
}

  

配置 VS Code 调试 JavaScript的更多相关文章

  1. 配置 VS Code 调试 PHP

    配置 VS Code 调试 PHP 1.下载 xampp 集成服务器wampserver3.1.0-Apache2.4.7_PHP5.6.3-7.0.23-7.1.19_MySQL5.7.19_Mar ...

  2. VS Code - Debugger for Chrome调试JavaScript的两种方式

    VS Code - Debugger for Chrome调试JavaScript的两种方式 最近由于出差的缘故,博客写的不是很多,一直想写一篇VS Code - Debugger for Chrom ...

  3. VS Code 调试 Angular 和 TypeScript 的配置

    一.安装插件 在 Visual Studio Code 中打开扩展面板(快捷键 Ctrl+Shift+X),搜索安装 Debugger for chrome 插件). 二.配置启动参数 在 Visua ...

  4. cocoscreator 2.04 配置 visual code 断点调试

    1,cocoscreator ,chrome浏览器,visual code 这三个软件的安装 2,官网配置visual code 环境 https://docs.cocos.com/creator/m ...

  5. VS code调试代码快速上手必备知识

    一.通过简单的配置运行一个JavaScript程序 1.打开(创建)一个新的工作空间(文件夹),并创建一个js文件: var name='world'; var s='Hello,${name}!'; ...

  6. chrome调试 JavaScript 脚本

    随着 JavaScript 应用的复杂性逐渐提高,开发者需要有力的调试工具来帮助他们快速发现问题的原因,并且能高效地修复它.Chrome DevTools 提供了一系列实用的工具使得调试 JavaSc ...

  7. 利用chrome调试JavaScript代码

    看见网上很多人问怎么用chrome调试JavaScript代码,我也对这个问题抱着疑问,但是没有找到一篇能用的中文文章(可能我的google有问题),也不知道怎么点出一篇E文的,感觉作者写得不错,所以 ...

  8. IDEA调试javaScript

            谈起JavaScript调试,大家可能想到的就是FireFox下的FireBug,这毫无疑问,FireBug基本已经成为JavaScript开发人员的必备工具.在本文中,将向大家介绍如 ...

  9. 调试 JavaScript 脚本

    随着 JavaScript 应用的复杂性逐渐提高,开发者需要有力的调试工具来帮助他们快速发现问题的原因,并且能高效地修复它.Chrome DevTools 提供了一系列实用的工具使得调试 JavaSc ...

随机推荐

  1. 图 Graph-图的表示及其遍历

    2018-03-05 16:19:46 图是计算机科学中的一个非常重要的概念,图是一种多对多的关系.从某种角度上来说树和链表都是图的一种特例. 一.图的抽象数据类型 二.表示图的方法 图是由结点和边构 ...

  2. js中中括号,大括号使用详解

    js中中括号,大括号使用详解 一.总结 一句话总结:{ } 是一个对象,[ ] 是一个数组 1.js大括号{}表示什么意思? 对象 { } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或 ...

  3. Java集合详解3:Iterator,fail-fast机制与比较器

    Java集合详解3:Iterator,fail-fast机制与比较器 今天我们来探索一下LIterator,fail-fast机制与比较器的源码. 具体代码在我的GitHub中可以找到 https:/ ...

  4. HLSL实现简单的图像处理功能

    由于对于dxva2解码得到的数据不宜copy回内存给CPU处理,所以最好的办法是在GPU上直接进行处理.D3D的像素着色器能够对像素直接进行操作,实现点运算极其简单方便,简单的卷积运算效果也非常好.但 ...

  5. linux-git shell colors

    git config --global color.status auto git config --global color.diff auto git config --global color. ...

  6. ansible入门六(roles)

    一.什么场景下会用roles? 假如我们现在有3个被管理主机,第一个要配置成httpd,第二个要配置成php服务器,第三个要配置成MySQL服务器.我们如何来定义playbook? 第一个play用到 ...

  7. 关于js中的原型链的理解

    我们知道无论什么时候只要创建了一个函数,就会为该函数创建一个prototype属性,这个属性指向函数的原型对象,默认情况下所有原型对象都会自动获得一个constructor(构造函数)属性,这个属性包 ...

  8. nfc功能读写 demo

    点此下载//这个demo是把这个程序作为一个手机启动选择的,只要一扫到卡片就会跳转到这个Activity. 只在当前Activity中有效参考:http://blog.csdn.net/zoeice/ ...

  9. C++面向对象高级编程(五)类与类之间的关系

    技术在于交流.沟通,转载请注明出处并保持作品的完整性. 本节主要介绍一下类与类之间的关系,也就是面向对象编程先介绍两个术语 Object Oriented Programming   OOP面向对象编 ...

  10. vue.js 源代码学习笔记 ----- 工具方法 env

    /* @flow */ /* globals MutationObserver */ import { noop } from 'shared/util' // can we use __proto_ ...