Chrome not requesting source map in inline script tag

Question

Chrome isn't loading our source maps for scripts included inline in our HTML:

<script type="text/javascript">!function t(n,e,r){ /* more code */}()
//# sourceMappingURL=public/js/edit-before.js.map
</script></body>

I know Chrome isn't requesting the source map because I set the server to log all requests and also checked the Chrome network console. I verified that the path to the source map is correct, the browser just isn't hitting it.

Should Chrome load source maps for JS in script tags? If so, what am I doing wrong?

Cringe

Answer 1

For me it's working currently in Chrome (maybe it wasn't as of time the question was asked), but still not in Firefox. But the path has to be correct, in this case an absolute url or a relative url, relative to the page the script tag is executed!

So having a path like public/js/edit-before.js.map and a page like /home/index.html, will result into /home/public/js/edit-before.js.map. Imagine what happens if you use your script tag on a page like /blog/2019/01/01/12345/article.html. So then better use https://example.com/public/js/edit-before.js.map.

And most often you have to enable sourcemaps in your Browser to see them, as someone described here: https://mcmap.net/q/1110155/-does-source-maps-in-style-tags-work.

Mandiemandingo