前端多个项目如何使用公共资源？#皮肤设置，#模块化！

Question

公司制定了多套广告投放系统，每套广告投放系统的皮肤不一样（样式不一样），域名不一样，但是系统逻辑大致相同，只有些许不同。如果需要增加功能或者改变样式，多套皮肤都需要手动添加或者修改，这样工作量有点大。有没有方案能实现：共同的样式或者功能只改一处文件就能实现所有投放系统的更改，某一套系统需要更改，只改对应的广告投放系统。也方便以后维护！

Answer 1

我也做过类似的多渠道多模块定制化的应用，也是好多共用，好多差异化的。
以前用的是angularjs，对于样式使用的是less，共用逻辑及组件都是做到细分。
模块内还能添加自己的逻辑来做到差异化处理。
使用gulp创建打包业务使用脚本处理自动化，基本就是如此。
任何应用都会有一定的代码冗余，就看开发维护管理上做到时间最优即可

Answer 2

两种方案可以搞定类似问题。

1. 组件化拼接；将常用固定的页面/样式/逻辑拆开，在使用时对应拼接，中间插入不同的定制功能和逻辑。缺点是前期拆分工作量细且大，组件/接口需要详细文档方便日后迭代。
2. 模板+高阶函数；HTML+CSS只有最基本框架(也就是不变元素), 其余功能和对应定制化都通过加工js来完成,为什么写高阶呢，利用各类高阶函数的应用二次封装函数，加快开发。缺点是虽然前期就可以快速开发，但遇到"可以但非必须"的模板之外的需求时，如果量大每次都需要通过函数来搞定，不利于日后业务的拓展。

所以短期高效推荐方法2, 长远稳定迭代推荐方法1.

Answer 3

这个问题之前见过，不会是同一个人/公司?????

Answer 4

是指颜色主题?
scss less 等变量覆盖就是了, 写一个脚本 , 动态插入覆盖变量文件