VSCode 断点调试

1. 开启sourcemap

vue.config.js文件中，添加如下配置:

configureWebpack： {
  devtool: process.env.NODE_ENV !== "production" ? "source-map" : ''  // 确保开启源映射
}

2. 启动项目

npm run serve

3. 配置debug调试

{
  // 使用 IntelliSense 了解相关属性。
  // 悬停以查看现有属性的描述。
  // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Launch Chrome against localhost",
      "type": "chrome",
      "request": "launch",
      "url": "http://localhost:8080",
      "sourceMaps": true, // 确保启用了源映射
      "webRoot": "${workspaceFolder}/smp_esa/src",
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*"
      }
    }
  ]
}

4. 出错

出现以下原因，可能是未启动项目、未打开正确路由首页 或者launch.json中sourceMaps、sourceMapPathOverrides配置错误