vue 2.5中使用 vscode 调试， launch.json 文件该如何配置？

Question

利用vue-cli命令行工具生成的 Vue 项目,使用直接在控制台npm run dev没问题。但是在 vscode 中直接 debug 会报错。 目前配置如下：

"configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Launch Program",
      "program": "${workspaceFolder}\\build\\dev-server.js",
    }
]

这个配置在 vue2.3 版本下执行没有问题，vue 最新的版本中（ 2.5 ）使用的是 webpack3，这个配置下会报Cannot read property 'NODE_ENV' of undefined。 实在找不到解决方法，请大神解答一下。

Answer 1

安装插件Debugger for Chrome，参考官方的CodeBook中的配置

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

除此之外还需要修改vue项目的配置

链接：在 VS Code 和 Chrome 中调试