vscode配置断点调试

1.配置launch.json

2.写入以下配置

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome",
      "url": "http://localhost:80", // 根据端口调整
      "webRoot": "${workspaceFolder}/src",
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*",
        "webpack:///./src/*": "${webRoot}/*",
        "webpack:///./*": "${webRoot}/*",
        "webpack:///*": "*",
        "webpack:///./~/*": "${webRoot}/node_modules/*"
      },
      // 使用浏览器的devtool，去掉则在vscode中控制
      "runtimeArgs": [
        "--auto-open-devtools-for-tabs"
      ],
      "sourceMaps": true
    }
  ]
}

3. 运行项目，根据项目占用的端口调整url
4. 启动调试工具
5. 会自动跳出一个chrome窗口，可以调试了.