VScode 调试vue项目配置

首先在vsocde 添加运行配置

然后将配置文件
修改成下面的格式

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "vuejs: chrome",
      "url": "http://192.168.2.10:82/",
      "webRoot": "${workspaceFolder}/src",
      "breakOnLoad": true,
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*",
        "webpack:///./src/*": "${webRoot}/*"
      }
    },
    {
      "type": "firefox",
      "request": "launch",
      "name": "vuejs: firefox",
      "url": "http://localhost:82",
      "webRoot": "${workspaceFolder}/src",
      "pathMappings": [
        {
          "url": "webpack:///src/",
          "path": "${webRoot}/"
        }
      ]
    }
  ]
}

···
然后在babel.config.js(没有这个文件就新建一个) 添加  'sourceMaps': true
![在这里插入图片描述](https://img-blog.csdnimg.cn/867cb7c877dc47b3b5021e8d7c2da16b.png)