Add web support (Take 3) #273
Conversation
… in getWebMetroConfig.js
|
I decided to give it a go as there was no progress on the other PR. @wcandillon Let me know what do you think! 🎉 Tested on native devices: Simulator.Screen.Recording.-.iPhone.17.Pro.-.2025-10-23.at.23.01.18.mp4And web: Screen.Recording.2025-10-23.at.23.02.55.-.03.mp4 |
|
This looks very cool and interesting. Also it looks like you added Web support the RNTA which is very cool. I need to see how you did it so I can also do it for the RNTA in RN Skia :) :) |
Wait… did I? 😆 What does RNTA stand for? |
|
@blazejkustra RNTA stands for React Native Test App: https://github.com/microsoft/react-native-test-app The reason is that expo app weren't supporting monorepos then (now it might be different). The main weakness of RNTA is that it doesn't support Web but you seem to have found a nice workaround :) |
Pure luck 🙌 |
|
FYI I was testing the web setup in my app and the app was crashing randomly on ios and android. Turned out that the trick with wrapping the native module in utils.ts wasn't working reliably on native devices so decided to try a different approach. Works on all platforms now 👍 |
|
@wcandillon what's the plan with the web support, shall I resolve conflicts now or wait? |
|
I apologies for having left this aside for now, I was doing some big improvement to the library. |
wcandillon
left a comment
wcandillon
left a comment
There was a problem hiding this comment.
This is fantastic. I am very excited about this. It all looks and works fantastic. My only question is regarding the creation of the main folder. why do we have this folder now?
It’s there to differentiate between platforms so we can have platform-specific files: one implementation for native and another for web. I added a catalog to separate these implementations. We could also have used |
| size = viewRef.current.getBoundingClientRect(); | ||
| } else { | ||
| // eslint-disable-next-line @typescript-eslint/ban-ts-comment | ||
| // @ts-expect-error | ||
| size = viewRef.current.unstable_getBoundingClientRect(); |
There was a problem hiding this comment.
This is unified in the latest version of React Native, should unify when Expo 55 drops in January.
4 participants
Built on top of #228
To test, go to the example app and do yarn web, then open http://localhost:8081/