avernet
avernet

Reputation: 31743

How to get Chrome to reload source maps?

I am on Chrome Dev 27, and in the Dev Tools settings checked Disable cache. When I reload a page, Chrome properly reloads all the resources used by map page, including the .js files. However, it doesn't automatically reload the corresponding source maps .map. Monitoring the HTTP traffic between Chrome my app, on subsequent page load, I don't see any request from Chrome for the .map files. How can I get Chrome to also reload the source maps?

The issue with Chrome not reloading the .map file is that it also won't reload the file from which the .js was generated, which in my case happens to be a CoffeeScript file (.coffee), which means that when debugging, in the Sources tab I am looking at an old version of the .coffee file, even if the new code (from the .js) is running.

Upvotes: 23

Views: 16132

Answers (4)

madannes
madannes

Reputation: 563

I resolved the issue by deleting the .map file and performing a hard reload (CTRL-F5).

I didn't want to lose all my history!

Clarification based on @jdbertron comment: my issue occurred when developing and debugging a React app. IIRC I deleted the .map file from the local dev environment (not in my browser history), then it was regenerated. That resolved my issue.

Upvotes: 1

Joao Franco
Joao Franco

Reputation: 9

Go to settings -> Show advanced settings -> Clear Browsing Data -> Check only "cached images and files" -> Click "clear browsing data"

This will clear the source maps you have cached in the browser without deleting all the cookies.

Upvotes: 0

Trendfischer
Trendfischer

Reputation: 7632

Just had the same issue and found some additional solutions:

According to this commit and this bug report for chromium, the problem is solved and should not affect one of the next builds.

A little bit simpler solution for this problem than clearing the whole Browser Cache:

Open the source map in a browser tab and do a hard reload (depending on OS, try CTRL+F5). This refreshes the file and keeps the browser cache.

An alternate way and perhaps a good practise is to hack the source map generation by adding a parameter like ?build=12345. Refer to your build tool on how to manipulte the filename of the source map.

If you have access to the server config or a .htaccess, you could set the header Cache-Control: no-cache for the source map extension like '.js.map'.

Upvotes: 3

Philip Thrasher
Philip Thrasher

Reputation: 411

I had this same issue just today. The wait to solve it for me was to close the coffee file's tab under sources, go to the network tab, right click, and select "Clear Browser Cache"

This fixed it for me.

That said, the mapped files don't always get "stuck" in cache for me... Only sometimes, and when they do, the clear cache trick fixes it.

Upvotes: 31

Related Questions