package.json
{
"name": "ComponentLibrary",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"storybook": "storybook start",
"prestorybook": "rnstl"
},
"dependencies": {
"react": "16.6.3",
"react-native": "0.57.8"
},
"devDependencies": {
"@storybook/addon-actions": "^4.1.6",
"@storybook/addon-links": "^4.1.6",
"@storybook/addons": "^4.1.6",
"@storybook/react-native": "^4.1.6",
"babel-core": "^6.26.3",
"babel-jest": "23.6.0",
"babel-runtime": "^6.26.0",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.51.1",
"prop-types": "^15.6.2",
"react-dom": "16.6.3",
"react-native-storybook-loader": "^1.8.0",
"react-test-renderer": "16.6.3"
},
"jest": {
"preset": "react-native"
},
"config": {
"react-native-storybook-loader": {
"searchDir": ["./App"],
"pattern": "**/*.stories.js"
}
}
}
storybook/index.js
import { AppRegistry } from 'react-native';
import { getStorybookUI, configure } from '@storybook/react-native';
import { loadStories } from './storyLoader';
import './rn-addons';
// import stories
configure(() => {
loadStories();
}, module);
// Refer to https://github.com/storybooks/storybook/tree/master/app/react-native#start-command-parameters
// To find allowed options for getStorybookUI
const StorybookUIRoot = getStorybookUI({});
// If you are using React Native vanilla and after installation you don't see your app name here, write it manually.
// If you use Expo you can safely remove this line.
AppRegistry.registerComponent('%APP_NAME%', () => StorybookUIRoot);
export default StorybookUIRoot;
Want to track your progress? Create an account with React Native School!