如何在VS代码中debuggingvue js应用程序？

我已经使用vue init webpack my-test3创build了新的vue.js应用程序。

在VS代码（v1.7.1），我试图debugging这个应用程序和默认launch.json程序设置为：

 "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceRoot}/app.js", "cwd": "${workspaceRoot}" }, 

但是app.js不存在。 我是否需要创buildapp.js ，如果是这样的内容？ 如果不是，我在哪里点program ？ 还是我需要做一些完全不同的事情？

更新1

好的，所以我试着改变program来指向/src/main.js 。 这是现在扔ES 2015错误。

 (function (exports, require, module, __filename, __dirname) { import Vue from 'vue' ^^^^^^ SyntaxError: Unexpected token import at Object.exports.runInThisContext (vm.js:76:16) at Module._compile (module.js:542:28) at Object.Module._extensions..js (module.js:579:10) at Module.load (module.js:487:32) at tryModuleLoad (module.js:446:12) at Function.Module._load (module.js:438:3) at Timeout.Module.runMain [as _onTimeout] (module.js:604:10) at ontimeout (timers.js:365:14) at tryOnTimeout (timers.js:237:5) at Timer.listOnTimeout (timers.js:207:5) 

我正在研究babelrc设置。 另外如果有帮助，系统正在运行：

 node v6.9.1 npm v3.10.8 babelrc v6.18.0 

Answer 1

所以在经过一番磕磕绊绊后，我认为debugging的起点必须启动服务器，因此在launch.json program设置为launch.json ：

 { "version": "0.2.0", "configurations": [ { "type": "node", "request": "launch", "name": "Launch Program", "program": "${workspaceRoot}/build/dev-server.js", "cwd": "${workspaceRoot}" }, { "type": "node", "request": "attach", "name": "Attach to Process", "port": 5858 } ] } 

现在，您可以通过按F5或debugging侧栏（ Ctrl-Shift-D ）然后select“启动程序”并单击绿色的开始button来debuggingvue.js应用程序。 您可以使用Ctrl-Shift-Y切换debugging控制台窗口。

对于后人， launch.json是在您尝试在应用程序的.vscode文件夹中进行debugging时首次创build的。