Hi, i created a new app using ionic start foo blank --type vue. After serving it using ionic serve I try to debug it using Chrome, and i can’t figure out the proper way to do it. Here is the scenario:
- There is no source code below localhost:8100, except for the generated JS files and an html
homefile. - I found my source code below
webpack://./src, but there is a lot of files with the name i’m looking for, as seen in the image (lots of Home.vue and App.vue). Only one of each really have the code i’m looking for and I can set breakpoints in these two files in order to debug. Is this correct? Why are there so many files in my tree?
When trying to use VS Code to debug, i installed ‘Debugger for Chrome’ extension, and created the following launch configuration:
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:8100",
"webRoot": "${workspaceFolder}"
},
When I start this config, browser opens with my app, but I just can’t set breakpoints in order to debug. The breakpoints are shown as “Unbound breakpoint”
I already tried to follow the instructions under Docs/Troubleshooting/Debugging without success.
Anyone can help me?
1 post - 1 participant