Webpack:多品牌应用

时间:2017-11-27 11:11:40

标签: angular webpack ionic2 bundle

我们正在开发一个带有Ionic 2的多品牌webapp,我们想使用webpack捆绑我们的代码。我们希望能够为每个品牌生成不同的捆绑包。

我们为应用的每项功能都有一个通用模块,但有些品牌需要特定的代码。我们希望webpack在每次检测到存在捆绑品牌的模块时加载品牌特定模块而不是通用模块。

例如,我们的应用程序有两个模块(1& 2),我们想将它捆绑为三个品牌(X,Y和Z)。这些是模块:

module1/module1.ts
module1/brandX.module1.ts

module2/module2.ts
module2/brandY.module2.ts

我们希望能够以通用方式导入这些模块,并且如果存在,则动态加载品牌特定模块:

我们会在代码中以这种方式导入模块:

import { Module1 } from 'module1/*******module1'; 
import { Module2 } from 'module2/*******module2'; 

每个品牌都应以这种方式解决进口问题:

BrandX:
'module1/brandX.module1.ts'
'module2/module2.ts'

BrandY:
'module1/module1.ts'
'module2/brandY.module2.ts'

BrandZ:
'module1/module1.ts'
'module2/module2.ts'

如何使用webpack解决这个问题?定制装载机?别名?

我们希望每个捆绑包都不包含其他品牌的代码,这就是我们尝试使用webpack解决它的原因。但是,如果某人有解决方案在运行时解决它(动态依赖注入),也会受到赞赏。

0 个答案:

没有答案