When hot loading through webpack, the generated souce-map itself locates the code incorrectly?

problem description

A strange problem with using webpack!
may be difficult to describe! I"ll try to be as detailed as possible!
the current project uses vue-cli to build

if an is added to the App.vue (topmost component), the file name of the b component, a, b component is index.vue
at this time I enter the route of the corresponding c component, and if the file name of the c component is also index , at this time, regardless of the error or typing bugger or console, in the code, the strong > will be located in the index.vue of the a component. If I delete component an in App or change the file name of component a to a name that is not index, I navigate to component b again!

the platform version of the problem and what methods you have tried

then I look at the webpack:// in the following figure. There will be only one index.vue below (after deleting a, it becomes the index), of b, but actually there should be three, that is, the index.vue, of a, b, c does not know whether it has anything to do with this

).

clipboard.png

what result do you expect? What is the error message actually seen?

how to solve it? The question is where ps: Google Baidu can"t find the answer, so come here to find the answer

https://codeshelper.com/q/10.
can be solved by changing to-sharpsource-map!

Dec.24,2021

maybe your webpack configuration is unreasonable. I didn't encounter this problem


https://codeshelper.com/q/10. source-map configuration


how the landlord solved this problem. I also encountered this problem. Sourcemap location error

Menu