1 visual studio code 的 extentions 里安装插件 debugger for chrome
2 devtool: 'eval-source-map', cacheBusting:false
3 chrome 快捷方式 在目标一栏,最后加上 --remote-debugging-port=9222,注意要用空格隔开
4 .vscode 里面放一个 launch.json 文件

{

"version": "0.2.0",

    "configurations": [
        {
            "type": "chrome",
            "request": "attach",
            "name": "Attach to Chrome",
            "port": 9222,
            "webRoot": "${workspaceRoot}/src",
            "url": "http://localhost:8080",
            "sourceMaps": true,
            "sourceMapPathOverrides": {
                "webpack:///src/*": "${webRoot}/*"
            }
        }
    ]
}
5 先点击chrome快捷方式,启动调试版的chrome
6 启动项目,并且在chrome里运行,localhost:8080
7 点击调试的 绿色三角,用attach方式,map到chrome的localhost:8080 这个地址

Visual Studio Code 断点调试配置方法(请按我的步骤 一定可以做到)的更多相关文章

  1. visual studio code断点调试react

    在项目配置文件   .vscode\launch.json 中添加:   "sourceMaps": true,   "skipFiles": [   &quo ...

  2. Visual Studio Code 断点调试Nodejs程序跳过node内部模块(internal modules)

    Built-in core modules of Node.js can be referred to by the ‘magic name’ <node_internals> in a ...

  3. 如何用Visual Studio Code远程调试运行在服务器上的nodejs应用

    假设我有一个nodejs应用,运行在AWS - 亚马逊云平台上(Amazone Web Service).我想用本地的Visual Studio Code来远程调试服务器端的nodejs应用. Vis ...

  4. SharePoint Framework 在Visual Studio Code中调试你的本地解决方案

    博客地址:http://blog.csdn.net/FoxDave Visual Studio Code不知道大家都有没有,界面清爽,编辑快速,是一个非常好的前端开发工具.本文介绍如何使用Goog ...

  5. Mac上使用Visual Studio Code开发/调试.NET Core代码

    Mac上使用Visual Studio Code开发/调试.NET Core代码 .Net Core 1.0终于发布了,Core的一大卖点就是跨平台.这个跨平台不只是跨平台运行,而且可以跨平台开发.今 ...

  6. [翻译]使用Visual Studio Code怎样调试Rust

    我将 Visual Studio Code 作为Rust首选编辑器.遗憾的是 VS Code 不能非常好地完成 Rust 的调试. 配置调试器不难,但仍然需要几个步骤.我已经完整配置了好几次.我正在写 ...

  7. 在Mac上使用Visual Studio Code开发/调试.NET Core代码

    .Net Core 1.0终于发布了,Core的一大卖点就是跨平台.这个跨平台不只是跨平台运行,而且可以跨平台开发.今天抽空研究了下在Mac下如何使用VS Code来开发.NET Core程序,并且调 ...

  8. SharePoint Framework 在Visual Studio Code中调试你的托管解决方案

    博客地址:http://blog.csdn.net/FoxDave 上一篇介绍了如何在本地调试你的SharePoint Framework解决方案,本篇介绍如何调试你的SharePoint Onl ...

  9. visual studio code 编辑器的配置及快捷键等, vscode, csc

    visual studio code (vsc) 对开发node.js,javascript,python,html,golang等比较友好,同时支持git浏览及分屏对比,运行速度快,所以是值得一用的 ...

随机推荐

  1. CentOS7中Tomcat的安装和配置

    Tomcat运行需要设置JRE目录,全局变量配置,请参见: Linux下JDK的安装和配置   当然也可以直接修改Tomcat的配置文件,请自行度娘   1.下载并解压 请先去官网找到需要下载的tom ...

  2. JAVA关于回文判断的实现

    (一). 设计思想: 首先输入字符串,然后判断长度若长度为0或1则输出TRUE若长度大于一则进行判断, 若符合条件则输出TRUE反之输出FALSE. (二)程序源代码 import java.util ...

  3. linux系统登陆过程

    一.物理直连登陆过程 初始化进程init 会根据直接连接的字符终端设备,打开getty程序,并关联在字符终端设备上tty1/2/3/4/5/6/7....上,在不同的终端设备上提示用户输入信息,等待终 ...

  4. Pycharm设置默认HTML模板

    Pycharm设置默认HTML模板 Bootstrap导入链接 <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/ ...

  5. L1和L2范数理解

    参考:https://www.jianshu.com/p/4bad38fe07e6

  6. Day1-Luogu-1631

    题目描述 有两个长度都是N的序列A和B,在A和B中各取一个数相加可以得到N^2N2个和,求这N^2N2个和中最小的N个. 输入输出格式 输入格式: 第一行一个正整数N: 第二行N个整数A_iAi​, ...

  7. java中二进制反码补码的理解

    7句真言 1,二进制最高位是符号位 0正数 1负数 2,正数的原码,反码,补码都一样 3负数的原码反码 补码 (符号位不变,其他的位数取反 0->1 1->0) 4 0的反码补码都是0 5 ...

  8. 吴裕雄--天生自然JAVA面向对象高级编程学习笔记:接口的基本实现

    interface A{ // 定义接口A public static final String AUTHOR = "李兴华" ; // 全局常量 public abstract ...

  9. 2017 北京网络赛 E Cats and Fish

    Cats and Fish 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 There are many homeless cats in PKU campus. They ...

  10. JavaScript 文件延迟和异步加载

    JavaScript 文件延迟和异步加载 -般情况下,在文档的 <head> 标签中包含 JavaScript 脚本,或者导入的 JavaScript 文件. 这意味着必须等到全部 Jav ...