你如何管理多个 ReactJS 项目？

Question

背景：我公司的网络应用程序实际上是几个完全独立的应用程序，它们对彼此的影响很小。这就是为什么将它们放在一个项目下没有任何意义 - 所以我正在使用单独的项目。然而，自从我开始在 ReactJS 中迁移和编写新应用程序（使用 Webpack 进行捆绑）后，我发现了很多重用的机会，以避免代码重复并避免在另一个应用程序已经获取它们之后再次下载公共资源：

• 我正在使用特定版本的 3rd 方 npm 模块 - 所以没有理由一遍又一遍地捆绑它们 - 也没有理由多次将它们上传到服务器（对于所有项目）。
  • 如何跨项目共享 package.json 固定版本？
  • 您是将所有/组的 npm 模块捆绑在一起还是单独捆绑在一起？对于本地部署，我想从服务器获取所有内容。
  • 您采取了哪些措施来确保不会忘记重新捆绑节点模块，以防您决定更新其中一个模块？
• 字体文件也有类似的问题（将字体保留在服务器上，另一种字体用于图标）
• 常用样式表
• 通用 JS 代码 - 类似 utils & common
• 常见的 web.config 配置
• 普通图片（目前其中一些内嵌在不同的包中）
• 最后 - 通用组件 - 你如何共享它们？您是否使用单独的项目并发布到 npm？符号链接？

也许，毕竟，我应该使用 monorepo？怎么做？

Answer 1

您可以创建一个单独的项目my_modules，它只是共享的通用包的清单。您将拥有一个包含所有常见模块的 package.json，以及一个 index.js，它执行以下操作：

import React, { Component, PropTypes } from 'react';
import moment from 'moment';

export { React, Component, PropTypes, moment };

然后，您将这个新的 my_modules 项目发布到 github，并在您的其他项目中安装 那个。

import { React, Component, PropTypes } from 'my-modules';

每次更改包时，您都会增加版本，然后在项目中更新该版本（这仍然有点麻烦，但您可以使用 greenkeeper.io 之类的东西来确保它们不会变得陈旧）。

同样，你可以对你提到的所有其他事情做同样的事情，尽管你不想太过分；您应该只共享不经常更改的标准资产，并将特定于项目的资产保留在自己的存储库中。

编辑：想补充一点，对于 React 组件，这实际上是一个非常好的实践，因为它迫使您编写通用的、独立的组件。你可以使用 React Storybook 之类的东西来单独创建这些组件。您可以发布一个包含所有包的主包，将单个组件作为包发布，或介于两者之间（例如，一个包中的所有表单组件）。不过，无论哪种方式，他们仍然可以方便地共享一个 repo。