1

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

4

1 回答 1

1

您需要自己添加故事,它不会自动生成。

这是故事书项目本身的例子,

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);
于 2018-06-21T03:30:40.630 回答