gluestack-ui
gluestack-ui copied to clipboard
gluestack
Hot reloading no longer works after adding Babel plugin
Description
joelso — Yesterday at 01:54 Hey everyone, I'm currently trying to understand the Babel plugin as detailed here: https://gluestack.io/ui/docs/production-optimizations/babel-plugin.
Do I have it right that I should add the plugin to my React Native app that is using Gluestack UI to get all performance benefits? I assume yes, but there is this wording in the docs that confuses me a bit (plus I noticed that in the boilerplate project no such babel config is there):
Note: We already provide you with the plugin config for @gluestack-ui/themed. So you have to do minimal configuration to get it working.
Also, after adding it, I've noticed that hot reloading no longer works. Has anyone else encountered this issue, or does anyone have any insights on how to address it? Or is it so that I should not need it/use it while in dev mode only for prod builds?
CodeSandbox/Snack link
No response
Steps to reproduce
- Go to '...'
- Click on '...'
- Scroll down to '...'
- See error
gluestack-ui Version
3.3.1
Platform
- [ ] Expo
- [ ] React Native CLI
- [ ] Next
- [ ] Web
- [ ] Android
- [ ] iOS
Other Platform
No response
Additional Information
No response
@ankit-tailor any updates on this issue?
P.S. Hot Reload is broken only for gluestack components. Also using // @refresh reset on the file with gs components also works but it's obviously not a solution
Also it looks like that the issue is related only to gluestack props manipulation. Hot reloading for regular props and adding / removing components works fine.
But when I try to change color or set gs-props like px nothing is updated. So something is wrong in visitor.JSXOpeningElement
@Viraj-10 @ankit-tailor
any updates on this issue? It's really hard to develop without hot reload since you spent too much time reloading scenes manually. Not sure how other devs live without it or they just ignore babel optimisations completely