1. 設(shè)置vue.config.js以便能夠準(zhǔn)確命中斷點(diǎn)
module.exports = {
configureWebpack: {
devtool: 'source-map'
}
}
2. 打開(kāi)調(diào)試配置文件launch.json, 添加或修改以下配置：
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
// For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
"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}/*"
}
}
]
}
3. 在終端運(yùn)行程序，yarn serve, npm run serve,或者在vue-ui中啟動(dòng)均可
4. 點(diǎn)擊debug綠色小三角老速，或者F5啟動(dòng)調(diào)試
