共同的故事书，讲述角度和反应

Question

我的团队中有反应性和棱角分明的项目，我想将故事书整合到这两个项目中。 我想知道是否有一种方法可以构建可在react和angular项目中导入的通用故事书？ 我唯一想到的就是使用WebComponents，但这会让React失去兴趣。

有人有什么经验吗？

（这是一个普遍性的问题，我只是在问一般性指示）

Answer 1

Storybook或任何UI组件文档库的想法是能够使您的组件得以开发并独立于其余UI源代码而存在。话虽这么说，这里可以遵循几种方法-

1. 使用Stencil之类的东西将所有组件移植到与语言无关的组件设置中。您也可以使用Web组件来这样做，但是使用Stencil会更短，更快地进行开发。是的，需要花精力去学习“还没有另一个JS框架”（或者不是！您是否知道Stencil只是一个编译器，您可以使用已经熟悉的技术堆栈来编写它！）。如果在生产环境中部署了这些应用程序，则一旦移植到组件上，就需要进行大量的测试工作。但是，您将在很长一段时间内获得的收益可以证明它在多技术堆栈环境中是合理的。

2. 从两个项目中分离出（仅）组件并将其放置到仅组件项目中。它们可以通过wrapper directives或与ngReact之类的第三方库共存。对于仅了解这些技术堆栈之一的开发人员来说，这可能会增加一定程度的复杂性，但无疑是一种实现方法。然后，您可以在这些原始的，半包裹的组件上使用Storybook，并且它可以作为所有组件的单个组件。

在任何情况下，组件都应遵循这些良好的设计原则-

• 从多个位置提取组件到单个事实来源。

• 使开发与使用组件的位置无关。

• 如果可能的话，至少对于您的组件，尽量不要使用多堆栈体系结构。首选语言不可知组件库/框架。