I have the following problem. I want to debug my Vue.js project with VS Code and Chrome. So I follow the official guide on the website Guide but it dont work. The Problem is that I always get the error :
unverified breakpoint
What do I wrong?
This is my vue.config.js
module.exports = {
configureWebpack: {
devtool: 'source-map'
}
}
This is my debugging stetting:
{
// 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}/*"
}
}
]
}
And this is my package.json
"name": "test-app",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
When I try npm run serve I get the error message unverified breakpoint and my breakpoint is never be hit.
I use the vue-cli 3 to generate the project.
Can someone help me pls?
Update
Maybe something is wrong with the path. Because when i run .scripts in the debugger console in VS Code I get paths like this
(c:\Users\XY\Desktop\Vue\test-app\webpack:\src\main.ts)
But there is no folder webpack:. But I have no idea why he is thinking that there is a folder. He make this in every file.
And in my tsconfig.js I already have "sourceMap": true.
Update 2
When I check the checkbox All Exceptions, VS Code show me all Exceptions in my App (they are catched). But my Breakpoints still dont work.
from Debug Vue.js App with VS Code. Error Unverified Breakpoint
No comments:
Post a Comment