我应该在哪里存储我的 React 可重用组件？

Question

我有几个 ReactJS 项目，我开始有很多可重用的组件。我不想将它们发布到 npm 或将它们与我项目根目录中的 imported node_modules 目录混合。他们应该去哪里？

我的项目是这样的：

A.jsx 定义了一个可重用的组件，我只是在各处复制文件......我只想把它放在一个地方，我的项目使用它与 import A from 'A'.

我曾尝试在 src/ 或 node_modules/ 中创建指向 A.jsx 的符号链接，但无法编译，就像 react-scripts 无法处理它们一样。你是如何解决这个问题的？感谢您的帮助！

Answer 1

I do not want them mixed with the imported node_modules

为什么不呢？将您的可重用组件提取到它们自己的库中，这是使它们可重用的最佳方式。一旦它们被提取出来，您就可以通过只导入您需要的内容来组成您的项目。您也可以编写自己的测试，而无需运行整个项目的测试。最后，您可以独立于项目处理不同版本的组件。

I have tried to make symlinks to A.jsx in src/ or in node_modules/ but…

将文件从一个项目符号链接到另一个项目可能是个好主意，但您是在项目之间创建依赖关系，而不是在项目和组件库之间创建依赖关系。如果要部署使用项目 A 中的组件的项目 B，则需要部署这两个项目并在服务器上重新创建符号链接。此外，项目 A 可能是一个比简单组件库更大的依赖项（具有自己的依赖项）。

I do not want to publish them to npm

如果你不想在 NPM 上发布你的组件（我都不想），我仍然建议你将你的组件提取到他们自己的存储库中（GitLab 有免费的私有存储库）。

然后您可以像这样直接从存储库安装库：

npm install git+ssh://git@git.mydomain.com:Username/Repository-name

它将在您的 package.json:

中创建一个条目

"Repository-name": "git+ssh://git@git.mydomain.com:Username/Repository-name"

然后您可以导入您的可重用组件：

import { ComponentA, ComponentB } from 'Repository-name'

Where should I store my React reusable components?