chrome, source map not loading

Question

I am generating the bundled.js file using webpack for a typical angular project. Now I deploy this on the web server. The bundle.js file has the following at the end

//# sourceMappingURL=main.bundle.js.map

However Chrome does not seem to detect that there is a sourcemap available. It does not even show the icon saying that a source map is available. How do I fix this? Plus should the path to the sourcemap be http://url/main.bundle.js.map? How does chrome know where to load the sourcemap from?

Necrotomy

See Also: Sourcemaps are detected in chrome but original source is not loaded – Primaveria

Answer 1

For chrome, source-map was not loading/working for me too. I kept on seeing the bundle.js files. However, in other browsers it worked, that are chrome related like Brave. So I just went into my chrome browses dev-tools settings > preferences and then in the bottom right, I clicked the "Restore defaults and refresh" button and it worked fine after.

Aquiculture

Not sure why it worked but it did, thank you! – Yuhas

Answer 2

These are the runes you are looking for (chromeDevTools):

Map webpack://./ to /

Insane

Can you expand on this a bit @jake? What underlying problem does this solve? – Monsoon

This tells chrome that the files under webpack's virtual directory should be mapped to your project directory. – Insane