带有ngrx存储和效果的Micro Frontends

问题描述

我正在将Monolith应用程序分解为angular 10上的微型前端。微型前端位于单独的存储库中，我想在微型前端中使用ngrx存储和效果。我无法在微型前端的应用程序模块中执行StoreModule.forRoot()。我想在shell应用程序中创建一个根存储，我想在微型前端中使用reducer和effect。我没有使用SPA之类的框架，而是使用webpack模块联合插件。我该怎么办？任何帮助将不胜感激。

解决方法

您将在从每个微前端提供的 StoreModel.forFeature() 中使用 EffectsModel.forFeature() 和 Module。我们已经在 Angular 的微前端中遵循了这一点，并且效果很好。

@NgModule({
    declarations: [...],exports: [...],imports: [
        BrowserAnimationsModule,BrowserModule,CommonModule,EffectsModule.forFeature([MyEffects]),StoreModule.forFeature(myFeatureKey,myReducer),...
    ],providers: [...],})
export class MyModule {
}

只需确保您的 myFeatureKey 在每个微前端中是唯一的字符串。