Vue debug方法

1 需求

在浏览器像es5那样直接调试源代码。
可直接参考官网，这里只是针对自己的环境做摘要。

2 方案

2.1 在浏览器中展示源代码

打开 config/index.js 并找到 devtool property。将其更新为：

如果你使用的是 Vue CLI 2，请设置并更新 config/index.js 内的 devtool property：

devtool: 'source-map',

如果你使用的是 Vue CLI 3，请设置并更新 vue.config.js 内的 devtool property：

module.exports = {
  configureWebpack: {
    devtool: 'source-map'
  }
}

2.2 在 VS Code 中调试

这种情况，其实就是配置vscode的插件 Debugger for Chrome
将生成的 launch.json 的端口修改为vue-cli-service serve --open 的端口即可。