我无法使用ReactNative

Question

我是日本人，英语不好，但我要感谢你。

我想做什么

我想将故事书与ReactNative一起使用，但它不起作用。

环境

• ＆＃34;反应＆＃34;：＆＃34; 16.3.1＆＃34;，
• ＆＃34; react-native＆＃34;：＆＃34; 0.55.4＆＃34;
• ＆＃34;样式组件＆＃34;：＆＃34; ^ 3.2.6＆＃34;，
• ＆＃34;打字稿＆＃34;：＆＃34; ^ 2.8.3＆＃34;，
• ＆＃34; @ storybook / react-native＆＃34;：＆＃34; ^ 3.4.5＆＃34;，

我尝试了什么

安装和运行故事书

$ npm i -g @storybook/cli $ getstorybook $ npm startu storybook

通过执行此操作，将执行默认包含的故事书，并正确显示默认按钮（象形图）等。

虽然到目前为止很好，但我无法很好地加载自制组件。

虽然stories (index.stories.tsx)目录的内容如下所示，但未读取目录中的

src。

├── app.tsx
└── components
    ├── atoms
    │   ├── Button
    │   │   ├── index.stories.tsx ←this
    │   │   └── index.tsx
    │   ├── Heading
    │   │   ├── index.stories.tsx ←this
    │   │   └── index.tsx

在github中查找ReactNative以外的项目似乎创建了一个名为.storybook的目录，

在ReactNative的情况下，一个名为storybook的目录与src并行创建，似乎已加载。

├── storybook
│   ├── addons.js
│   ├── index.android.js
│   ├── index.ios.js
│   ├── index.js
│   ├── stories
│   │   ├── Button
│   │   │   ├── index.android.js
│   │   │   └── index.ios.js
│   │   ├── CenterView
│   │   │   ├── index.js
│   │   │   └── style.js
│   │   ├── Welcome
│   │   │   └── index.js
│   │   └── index.js
│   └── storybook.js

我尝试了第1部分

storybook/storybook.js

中的

configure(() => {
  require('./stories');
}, module);

将路径更改为 module.exports = require.context('../components/', true, /.*\.stories.tsx$/)

但是，显示以下错误。 TypeError: require.context is not a function

我尝试了第2部分

通过引用this page

安装react-native-storybook-loader

创建的storybook / storyLoader.js的内容是

function loadStories() {
     require('../src/components/atoms/Button/index.stories');
     require('../src/components/atoms/Heading/index.stories');
     require('../src/components/atoms/ListItem/index.stories');
}

这样，扩展名无法正常显示，故事书上也没有显示任何内容。

你想听的东西

如何根据特定规则使用ReactNative读取某个位置的故事（如上述目录结构）？

我很快就不知道ReactNative，storybook或Typescript，我也不知道原因。

在这段时间里，打字稿并没有得到太多的考虑，我们还没有为打字稿做过故事书设置等，但也许可能是原因。

谢谢你的时间。