请教各位，前端怎么解决项目不同版本代码复用的问题？

[xfq2]

我开发了项目 A ，一开始是为区域 A 服务的，后来变成标准化产品，也要给别的区域部署开发，但区域都有自己的个性化需求，所以我尝试过下面的解决方案：

1. 在项目 A 新建一个针对区域 B 的分支，在上面维护开发区域 B 的需求，但这样在后期有很多区域的时候，很难维护。举例，有些 bug 在这个分支修复了，别的分支还存在；突然上面说要改版首页或功能，要求所有区域升级，这 NM 的

2. 主仓库为基础库 fork 出子仓库的模式开发，只能复用部分功能，而且很麻烦，各种合并或 cherry pick

各位进来的大佬，有什么好的解决方案吗，主要是想维护方便。感谢分享指教

[babyoung]

把公共的部分抽出来啊

[7inFen]

创建自用的组件库/模板库

[xfq2]

@babyoung 怎么抽，展开讲讲

[DesnLee]

把你公共部分封装成组件复用

[James2099]

@xfq2 高耦合，低内聚

[codingguy]

通用模块发布到 npm 仓库，用到的地方安装一下

[xfq2]

@DesnLee 公共部分太多了，个性化都是局部的修改

[dudubaba]

无解，不管是组件还是分支，只要定制化就是坑，纯人力维护。

[xfq2]

@codingguy 很难以组件的形式复用

[Niphor]

专门弄个人 对提交的代码审查了入库

[MRG0]

复制粘贴吧，个性化内容越多组件越难写

[xfq2]

@MRG0 这就是目前的方法 难受啊

[hervey0424]

复制粘贴其实是最快的, 考虑的越多麻烦越多, 需求有变化改起来考虑的就越多

[tomieric]

submodule

[ayase252]

你都能辨别出来哪些是公共部分，为啥抽不出来？

[kucy]

无解。只能很多个 if-else 。但代码会臃肿，判断也复杂。

[xfq2]

@ayase252 举例，区域 B 相对于项目 A 增加了一个霸屏功能，功能较复杂开发时需要修动很多公共部分代码，而这在区域 A 是不需要的

[6379616e]

无非就是一些常见的手段：组件化开发、参数配置化、版本和分支管理、代码动态加载分割、高度可配置的模块等等。

具体一点的话就是基于上面的一些思想去做的事情，比如：
1.使用组件库去维护一些常见的 UI 模块；
2.模块化开发，将项目去拆分多个模块，每个模块去负责实现一个功能，尽量单一职责，最终目的是更好地管理和复用代码；
3.可以结合一些配置文件，把一些可变的配置项抽离出去，放在单独的配置文件中，可以包括一些主题样式，api ，功能开关等等，针对不同的版本项目去创建不同的配置文件
4.还有就是一些条件编译、模块动态加载，异步组件等等。

[wpzz]

用一个 npm 包，包里面拆分出来各个区域路径，
如
xxxpkg/区域 A/组件 A
xxxpkg/区域 B/组件 A
组件 A 在 xxxpkg 中可以维护公共部分，在各区域路径下，实现自定义部分。

有 bug 修复了更新版本，其他项目更新一下包版本即可。

[codeself]

考虑下 git 子仓库？公用的丢子仓库里