WebStorm调试Vue CLI 3工程

问题

在WebStorm中调试Vue工程。

步骤

浏览器中启用显示源代码

这里使用的Vue CLI 3工程：

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

WebStorm运行vue

在菜单栏View→Tool Windows→npm，选择serve进行运行。

WebStorm运行调试进程

按住Command+shift，点击控制台http请求路径，即自动打开一个浏览器调试进程，进行vue断点调试。

参考

• Debugging in VS Code
• Vue.js