如何导出在 storybook 中创建的 React Native 组件以便在实际应用中使用?

Posted

技术标签:

【中文标题】如何导出在 storybook 中创建的 React Native 组件以便在实际应用中使用?【英文标题】:How to export React Native components created in storybook for it to be used in actual app? 【发布时间】:2020-09-23 02:11:49 【问题描述】:

我知道我们可以在 Storybook 中单独创建和测试 React Native 组件。但是我们如何导出/发布组件以集成到我们的应用中?

在反应中 -

    我使用了 react-docgen,它允许我将组件创建和记录为独立项目 然后我将构建我的 doc 应用程序并将其作为一个包发布到 npm 注册表并 npm install 作为我的应用程序中的依赖项以导入这些组件

我们如何在 Storybook 中使用 React Native 做同样的事情?我应该-

    在我的实际应用中复制测试组件的文件/代码? 仅导出 Stories 文件夹中的所有内容并构建和发布为包并安装为我的应用中的依赖项? 在我的实际应用程序中安装故事书?但我想这不是一个选择,因为故事书本身应该作为独立应用程序运行

可能是我遗漏了一些明显的东西,因为没有教程/文章/文档谈论如何在最终应用中使用创建的组件?有人可以阐明一下吗?谢谢。

【问题讨论】:

【参考方案1】:

好吧,终于有人在教程里说这个了-

找到所需的组件和状态后,您可以查看需要放置在应用程序中的源代码,以获得完全相同的功能

因此,毕竟它就像一个 UI 库文档,您需要从其中复制示例代码,并且不能将故事作为依赖项添加到您的项目中。

【讨论】:

以上是关于如何导出在 storybook 中创建的 React Native 组件以便在实际应用中使用?的主要内容,如果未能解决你的问题,请参考以下文章

通过 AS3 访问(用于导出)在 Flash 编辑器中创建的矩形的渐变

我们应该在 Angular 应用程序中创建的所有模块中导入 BrowserModule 吗?

NX - 带有 Storybook 和单独导出组件的 UI 库

删除在 DLL 中创建的对象

卸载并重新安装应用程序后访问在公共文件夹中创建的文件?

如何模拟在函数中创建的类(新运算符)?