如何使用Chrome插件调试器在vscode中调试调试器 项目地址:ewall 1106/vscode中的商城调试vue如何使用Chrome的插件调试器在vs code中进行调试？ 安装插件以在vscode中安装该扩展。 打开源地图。如果你是在vue-cli3.x+之上搭建的项目，需要在vue.config.js中配置 configure web pack:{ dev tool:" source-map "；}如果你是用较低版本的scaffolding搭建的项目，你需要先在自己身上设置source-map。 dev tool:“source-map”；调试，选择一个新的launch.json文件，选择Chrome环境。 然后将生成的launch.json的配置内容改为如下:{"version": "0.2.0 "，" configuration s ":[{ " type ":" chrome "，" request": "launch "，" name": "Panda-mall debugger "，" url": "http://localhost:8080 "，" webRoot ":$ { workspace folder }/src "，" breakOnLoad": false，" sourcemappath overrides ":{ " web pack://。/* " $ { webroot }/* "，" web pack://src/* ":" $ { webroot }/* " } }开始调试。让我们在任意位置进行断点测试(下图中的第51行 当点击绿色的play按钮开始调试时，浏览器中会自动打开http://localhost:8080实例，然后会命中vscode中设置的断点。 同样，浏览器也会处于断点调试状态。 图像https://cn.vuejs.org/v2/cookbook/debugging-in-vscode.html