Are there any approaches to get source maps working with react native and shadow-cljs

Question

It would be really useful for debugging if there was a way of getting source maps to work with react native and shadow-cljs. There's currently an issue with the bundler preventing additional source maps from being provided, so it's not possible out the box and would require somee kind of workaround.

https://github.com/facebook/metro/issues/104

Using react native with figwheel circumvents the problem somehow; I was wondering if there might be something we can do with shadow-cljs to get source maps working - perhaps by merging the sourcemaps ourselves.

I've noticed there are a few packages out there for merging source maps - e.g. sorcery https://www.npmjs.com/package/sorcery and merge-source-maps https://www.npmjs.com/package/merge-source-maps but I'm not sure how to go about plumbing these into the bundler.

Answer 1

It is my understanding that source-maps only work when using the "Debug in Chrome" option where the JS code is actually loaded in Chrome? Otherwise I'm missing something important somewhere since sources processed by metro definitely don't support merging source maps.

I'll be working on the react-native support in the next few weeks where I'll look into this further.

Comments

Yep, source maps only work when "Debug in Chrome" is enabled - however this is useful enough for development - if you switch on "pause on caught exceptions" when there's an error the debugger will break and you'll be taken to the line that caused the error. With figwheel in dev mode this is somehow mapped back to clojurescript files, (possibly because the bundler is circumvented?).

---

Yes, exactly. metro is bypassed and the sources are loaded dynamically.

Same could (will probably) be done with shadow-cljs. I still had hope metro/babel would add support for doing this properly but that doesn't seem to be happening anytime soon.

---

Just to update here,  the latest version of shadow-cljs (2.8.45) supports source maps in development in this way - thanks Thomas!