Setup React Native Storybook

Automates the setup of Storybook v10 for React Native projects, handling the different configurations needed for Expo, Expo Router, React Native CLI, and Re.Pack setups. The skill intelligently detects your package manager (npm, yarn, pnpm, or bun) and uses the right commands throughout the installation process. It's especially thoughtful about Expo projects, using `npx expo install` to ensure dependency versions stay compatible. This saves you from the usual headaches of wiring up Storybook in a mobile environment where the Metro bundler and native tooling add complexity. If you're building a component library or design system for a React Native app, this gets you from zero to running Storybook without the manual configuration wrestling.

skills.sh installs: 557
GitHub stars: 1.3K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add storybookjs/react-native --skill setup-react-native-storybook --agent claude-code

Installs into .claude/skills of the current project.

Files

React Native Storybook Setup

Add @storybook/react-native v10 to a React Native project.

Important: Detect the project's package manager (look for yarn.lock, pnpm-lock.yaml, or bun.lockb) and use it for all install/run commands instead of npm. The examples below use npm but substitute accordingly (e.g. yarn add instead of npm install, yarn storybook instead of npm run storybook). For Expo projects, use npx expo install (or bunx expo install, etc.) to install dependencies so Expo can resolve compatible versions.

For the init command, use <pm> create storybook with the flags shown below. Only npm needs -- before the flags. Never use npx/bunx etc for this.

Four setup flows based on project type: