CODEWITHSUNDEEP
react-nativestorybook
Manspof
Manspof

Reputation: 357

React-native doesn't show storybook elements

I open new react-native v0.49 project and install storybook with command

npm i -g @storybook/cli

then i open my project and run

getstorybook

I see storybook modules in my project

    {
  "name": "materialApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest",
    "storybook": "storybook start -p 7007"
  },
  "dependencies": {
    "react": "16.0.0-beta.5",
    "react-native": "0.49.3"
  },
  "devDependencies": {
    "babel-jest": "21.2.0",
    "babel-preset-react-native": "4.0.0",
    "jest": "21.2.1",
    "react-test-renderer": "16.0.0-beta.5",
    "@storybook/react-native": "^3.2.13",
    "@storybook/addon-actions": "^3.2.13",
    "@storybook/addon-links": "^3.2.13",
    "react-dom": "16.0.0-beta.5",
    "prop-types": "^15.6.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

when i run npm run storybook i see enter image description here

then i connect the server to react-native app by

adb reverse tcp:7007 tcp:7007

and I run react-native app by

react-native run-android

but I don't see any elements in the server enter image description here

Upvotes: 1

Views: 1352

Answers (1)

WooodHead
WooodHead

Reputation: 173

You need to add stories by yourself, it's not generated automatically.

this is example from storybook project itself,

https://github.com/storybooks/storybook/blob/master/examples/react-native-vanilla/storybook/stories/index.js

storiesOf('Button', module)
  .addDecorator(getStory => <CenterView>{getStory()}</CenterView>)
  .add('with text', () => (
    <Button onPress={action('clicked-text')}>
      <Text>Hello Button</Text>
    </Button>
  ))
  .add('with some emoji', () => (
    <Button onPress={action('clicked-emoji')}>
      <Text>😀 😎 👍 💯</Text>
    </Button>
  ));

storiesOf('Knobs', module)
  .addDecorator(withKnobs)
  .add('with knobs', knobsWrapper);

Upvotes: 1

Related Questions