- Create a new app using
getstorybookto add React Native Storybook to your app.
We will need to make a few modifications to the boilerplate created by
storybook/index.ios.jssince CRNA (unlike vanilla React Native boilerplate) does not need different entry points.
It has the following changes to the initial
- Instead of the registering the component to
AppRegistry, it will be exported. This is needed since CRNA abstracts the
- It changes the
hostso that your phone can access Storybook’s server (thanks to this Stack Overflow post (thanks to this Stack Overflow post).
We need to modify the
npm scripts so that they also start the Storybook server. For platform-independence, we use
After that, we can use the Storybook component directly in
App.js as entry component:
Finally: start your app, open
http://localhost:7007 and enjoy 😊.
Note. If you want to change back to your usual entry component, you will need to change
App.js again. I’d prefer to choose the entry component by using environment variables or flags (that can be set in
package.json). Currently, CRNA has no way to solve this, see this issue. If you found another way to solve this, I’d like to know :).