在 chrome 开发工具中加载单独的源映射文件

Question

Is it possible to load an external source-map file (JSON), not included in the minified JS file used on a website?

So far the only ways I know of to include a source-map for a particular js file is to either inline it, add a link in comments or set the path in HTTP header.

So I wonder - is it possible to load a source-map file that can't be accessed via HTTP? For instance - load it from my local drive, and point it to the js file it is supposed to be mapping?

Cheers

Answer 1

I know question is old, but had it myself nevertheless. Here's how you do it in Chromium 63

1. Open Debugger
2. Right-click in source code area
3. Select "Add source map…"
4. Enter URL to source map file
   • if browser is able to download it and process it then sources appear as entry in source tree.

PS built with hidden source (separate files, no source comment)

PPS does not matter where files are hosted, because it is URL. Must be accessible by browser.

Answer 2

August 2022, Chrome 104:

1. Open Chrome Dev Tools
2. Go to " Sources " tab
3. Find the .js file you are looking for. Click on it.
4. Right click somewhere ON THE SOURCE .
5. Find "Add source map..." option there.

(I first wrote this as a comment to the other answer , but @christian-vincenzo-traina suggested having it as a separate answer.)