React Native Server example with storybook 5

I’ve spent the past couple of days trying to get sb5 server running, but I end with a page without any stories populated. Only the device addons work. I’ve downgraded and upgraded using past issues as reference, but I’m still not seeing anything. I tried again today using version 5.1.0-alpha.36 which is set on all @storybook/* packages, cleared cache and reinstalled. No luck. I’m also using the migration guide to set these up. https://github.com/storybooks/storybook/blob/next/MIGRATION.md#react-native-server

Is it possible someone could add a react native example that includes the server feature? It shouldn’t take more than 10 minutes, and it should help newcomers save hours spent on trying to get it to work. That would be much appreciated. Thanks

[sirsavary]

Chiming in to say I’m experiencing the same issue. Created a new project using Expo v2.12.2 and Storybook v5.2.0-beta.0. I have tried with both a physical device and a simulator. What I’ve noticed is that I can’t seem to access the Storybook server over the network, e.g. navigating to 192.168.0.x:7007 in my phone’s browser shows nothing

That being said, I can access the Expo server from my phone so it’s not an issue with my network/PC. I’m going to make the assumption that Storybook is only permitting connections from localhost.

…and this is exactly the case. Workaround for anyone who stumbles upon this:

1. Modify your start-storybook command to include -h 0.0.0.0 or if you’re worried about security, use -h [your local IP], where local IP is usually going to be something in the form of 192.168.0.x
2. Update “storybook/index.js” and change const StorybookUIRoot = getStorybookUI({host: "[IP used with -h]"});
3. Fire up react-native/expo and Storybook server
4. Test that your phone/simulator can access [IP used]:7007 in its browser
5. Opening your RN app should now load the stories back on your PC

Note that these instructions assume you’re using the default port (which in my case is 7007). If you’re using a custom port, you’ll need to update getStoryBookUI to use it.

[betoharres]

@Gongreg There are no error msgs on console. PFA the emulator / server / web-server

If you see this error at the end of the log:

adb: error: cannot bind listener: Operation not permitted

It’s because adb is requesting root access, so you’ll need to to run these two commands:

adb kill-server
adb root

Try to to add the storybook port at the build command, like so:

react-native run-android --port=7007

make sure this error did not appeared:

adb: error: cannot bind listener: Operation not permitted

If that doesn’t work, you can try running:

adb reverse tcp:7007 tcp:7007