Getting wrong breakpoints / lines in Chrome when using this template out-of-the-box

[0xgeert]

Using this template out-of-the-box I'm having issues with setting breakpoints in Chrome. Specifically:

• setting a breakpoint doesn't stop at that point (nor anywhere else afaik)
• some lines on which a breakpoint should be possible cannot be set.

I'm running my dev env with npm run dev

This happens on both .vue as well as normal .js-files.

Additionally, I thought this might be an issue with hot-reloading but it happens on a clean run of npm run dev as well as on consecutive runs.

Is this a known issue? Any workarounds?

[0xgeert]

Investigating a bit further changing from #cheap-module-eval-source-map to #cheap-module-source-map seems to solve it for now. Leaving this open for a while to see how it goes.

[tsneed290]

Had similar issues. Changed "#cheap-module-eval-source-map" to "#source-map" in webpack.dev.conf.js and I'm good now.

I also have this issue when running unit tests in Chrome browser (which uses #inline-source-map). Changing that to "#source-map" didn't seem to work. Hoping someone has a good workaround for that case :)

[TheMechanic]

@tsneed290 : I'm not working with Vue currently, but i have a very similar config. I encoutered the same issues. the devTool param is not the same for dev and for test, because test use karma-sourcemap-loader, and I'm pretty sure that prevent to use the same config :(
For me breakpoints with "#inline-source-map" in test runs, but i have some weird behaviours, and no way to access variables in console, no mapping there...

[0xgeert]

wrong close

[dweremeichik]

duplicate of #520?