关于visual-studio-code:如何在vscode中调试代码

应用步骤

1 在我的项目根目录上面创立./vscode/launch.json文件,内容如下

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debugger In Chrome",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceFolder}/src",
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*"
      }
    }
  ]
}

2 启动你的本地我的项目
示例npm start

3 按f5启动调试
vscode会主动关上浏览器,而后跳转至上述配置中url指向的地址。

4 增加断点
vscode中找到须要增加断点的代码行,点击行号左侧增加断点。

5 刷新浏览器,当运行到断点处,代码就会停住,而后你就能够开始调试你的代码了。

配置项介绍

url
填写你本地启动我的项目的地址。

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理