React Native Storybook
Select storybooks inside your editor.
How do I use it?
Install it, ensure that the configuration is right. You should see a new section under the files in the Explorer panel called "Storybook".
If your react-native server crashes, use the command "Reconnect Storybook to VS Code" to re-connect.
What does it do?
- Connect to the React Native storybooks web socket.
- Single click a story to open it in your simulator.
- Double click to open story in your editor.
- Search / picker for quick story activation
react-native-storybooks.host: string (default:
react-native-storybooks.port: number (default:
react-native-storybooks.storyRegex: string (default:
react-native-storybooks.storybookFilterRegex: string (default:
You can either change these in your user settings, or per-project you can create a
.vscode/settings.json file and add them there.
If you work with quite a lot of stories in a project, it can be a bit of a chore to scroll through them all, so you can use setting
react-native-storybooks.storybookFilterRegex to filter down the shown stories. If you do this on your user settings then only you will see the changes.
You can also access the quick picker menu with:
Storybook search / pickercommand; or
- via shortcuts:
CTRL+K Son Windows
CMD+K Son Mac
Nothing critical ATM.