reactjs - 在两个 React 应用程序之间共享组件

Question

我有两个 React 应用程序，我想将它们分开。但是，这两个应用程序的许多组件非常相似。

共享组件的最佳方法是什么？

以下是我能想到的一些方法:

1. 复制组件，因为它们可能略有不同
2. 从项目范围之外的文件夹导入文件

谢谢

Answer 1

如果组件“可能略有不同”，那么也许您应该复制它们。但如果你能找到一种方法来保持它们相同(并保持传入的 props 的变化)，我是这样做的:

我设置了一个包含所有通用组件的单独项目。我可以通过两种方式从服务器构建系统访问这些组件:

1. 发布公共(public)或私有(private) npm 模块，并像任何其他 npm 模块一样添加到 package.json(了解有关私有(private)模块的更多信息 here)
2. 如果私有(private) npm 模块太复杂，但您仍想保持项目私有(private)，则可以将私有(private)存储库添加到 package.json 中。您需要将 ssh key 保存在构建系统上，以便它可以登录 github 或 bitbucket(或其他)来 checkout 您的代码。

如果您选择选项 2，您可以像这样在 package.json 中包含存储库。然后，当运行 npm install 时，它将要求您提供私有(private)存储库的凭据(或者可以使用 ssh key )。

...
"dependencies": {
  ...
  "your-common-module": "git+ssh://git@bitbucket.org/path/to-repo.git#0.1.5"
}