How can I load stories dynamically

[xareelee]

In this video from egghead, it demonstrate how to load react storybook stories dynamically, but it doesn't work on a react native project:

// storybook/index.ios.js
import { AppRegistry } from 'react-native';
import { getStorybookUI, configure } from '@kadira/react-native-storybook';

const req = require.context('../src/components', true, /\.stories\.js$/);

// import stories
configure(() => {
  req.keys().forEach(path => req(path));
}, module);

const StorybookUI = getStorybookUI({port: 7007, host: 'localhost'});
AppRegistry.registerComponent('ofoBikeIntl', () => StorybookUI);

Unfortunately, it shows require.context is not a function in my iOS simulator.

I put React Native components and the stories in the same folder. How can I load all those stories dynamically from the src/ folder in a React Native project?

[thani-sh]

Hi,
The require.context function is provided by Webpack so it only works on React Storybook. React Native uses its own bundler which unfortunately does not have this feature at the moment.

[xareelee]

@mnmtanish Thanks.

I found a library to solve this problem (workaround). See react-native-storybook-loader.