如何在VS代码中调试vue js应用程序?
问题描述:
我使用vue init webpack my-test3
创建了新的vue.js应用程序。如何在VS代码中调试vue js应用程序?
在VS代码(V1.7.1),我试图调试该应用程序和默认launch.json
已计划设置为:
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
"program": "${workspaceRoot}/app.js",
"cwd": "${workspaceRoot}"
},
但app.js
不存在。我是否需要创建app.js
,如果是这样的内容?如果不是,我在哪里指向program
?还是我需要做一些完全不同的事情?
UPDATE 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
答
所以周围的一些障碍之后,我计算过,起点调试已启动服务器,因此program
设置为/build/dev-server.js
,在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或调试侧栏(Ctrl-Shift-D
),然后选择“启动程序”并单击绿色的开始按钮来调试vue.js应用程序。您可以使用Ctrl-Shift-Y
切换调试控制台窗口。
对于后人,launch.json
是在您第一次尝试在您的应用程序的.vscode
文件夹中进行调试时创建的。
我可以问你另一部分的配置吗?因为如果是这样的话,你会改变我的调试生活:) –
我刚刚走出去,明天我会用完整的launch.json更新。 – CrnaStena
这将是非常感激,也知道他的你的开发工作流程。 像: - F5在VSCode - 这是它 或 - NPM运行开发 - vsCode F5 - 等等.... –