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. CSP-S 2019 初赛游记

    Day 0 上午考了一套毒瘤的数据结构题,考的我心态爆炸SB出题人 晚上考了一套初赛模拟,只考1h,然后我91分,感觉初赛完全没问题? 回寝室后一直在忙活,整理东西什么的,居然将近12点睡? Day ...

  2. Python - 列表与字符串的相互转换

    1. 列表转换成字符串,用''.join() # 创建一个列表 list1 = ['a','b','c'] # 将列表的元素拼接为字符串 print(''.join(list1)) # 将列表的元素通 ...

  3. Navicat相关注册码

    用户名和组织随便起. 注册码如下 --Navicat for SQL Server V10.0.10 NAVD-3CG2-6KRN-IEPM NAVL-NIGY-6MYY-XWQE NAVI-C3UU ...

  4. Red_Hat yum源配置

    http://www.linuxidc.com/Linux/2016-06/132171.htm

  5. Javascript调用本地数据库

    window.location.href = urls; // 本窗口打开下载 window.open(urls, '_blank'); // 新开窗口下载 (1)new ActiveXObject( ...

  6. Unity初识项目结构与面板

    一.Unity的项目结构 Unity中的一个项目是有若干个场景组成的,每一个场景又是由若干个游戏对象组成的,每一个游戏对象身上有若干个组件,每一个组件有若干个属性. 项目——>场景——>游 ...

  7. 「SCOI2010」幸运数字

    传送门 Luogu 解题思路 首先构造出所有的幸运数字. 然后考虑一个幸运数字会产生多少贡献. 对于一个数 \(x\),它在区间 \([l,r]\) 内的倍数的个数为 \(\lfloor \frac{ ...

  8. 简单模拟IOC容器:返回对象并能抛出异常

    本次要求:已知com.zzj.vo包下分别有Tiger.lion.Elephant三个Java源文件,请据此实现以下功能:①.自定义一个名为Component的注解,要求该注解只能用于类且代码运行时该 ...

  9. Problem A: Assembly Required K路归并

    Problem A: Assembly Required Princess Lucy broke her old reading lamp, and needs a new one. The cast ...

  10. metasploit练习

    复现ms08_067_netapi 使用模块 msf5 > use exploit/windows/smb/ms08_067_netapi 查看配置 msf5 exploit(windows/s ...