如何根据可重用组件分离大型React代码库?

时间:2016-12-08 01:18:29

标签: javascript reactjs architecture npm

我目前有一个庞大的通用反应应用程序。我想从应用程序中提取一些组件并将它们放在一个单独的仓库中,以便其他团队/项目可以导入它们并在它们的前端使用它们。

例如:包含组件的存储库1

存储库2是一个可以从存储库1导入的Web应用程序

我有些担忧:

我想限制重复/未使用代码的数量

类似于如何导入单个lodash函数(从'node_modules / lodash / lib / ...'导入forEach从'lodash'导入{forEach},

我希望组件能够独立导入,而不必捆绑所有组件

我不想复制依赖项

如果我的所有组件都构建为单个文件并且它们都需要React,我会将React捆绑到我的代码库中,与我拥有的组件数量相同。

为我导出的每个组件都有一个单独的构建文件是一个好主意吗?如果我不导入构建的文件,我是否必须明确告诉我的主存储库中的webpack查看我的组件的node_modules?

1 个答案:

答案 0 :(得分:0)

据我所知,您的React组件现在位于项目的不同子文件夹中。为什么不将它们移到单独的Git存储库中并使用Git SubModules将这些存储库连接回您的应用程序?

您也可以使用NME包制作React组件并使用NPM安装它们。

每个使用组件的应用都需要将其包含在构建链中。我认为组件不应该真正构建自己。