NgRx Effects loaded twice

Question

I have a simple feature module, which provides services and imports its own stats fragment as a feature:

@NgModule({
  imports: [
    CommonModule,
    StoreModule.forFeature('alarms', alarmsReducer, { initialState: alarmsInitialState }),
    EffectsModule.forFeature([AlarmsEffects])
  ],
  declarations: [],
  providers: [
    AlarmsFacade,
    AlarmsService
  ]
})
export class AlarmsModule {
}

And I'm importing this module in two other modules, a page that needs to have access to the services, and AppModule as I need to import it here in order to have the state initialized properly.

When I'm checking Redux DevTools, I can clearly see that @ngrx/store/update-reducers is called twice for the feature alarms. This results in the state being frozen, stoping all the effects (including the ones not related to alarms feature).

The timeline below can show the issue (a third @ngrx/store/update-reducers action is fired after the effects init while there's only two features at the moment, it contains reducers for feature 'alarms'):

How can I avoid the effects to be loaded twice? I tried to remove the module from AppModule but it's breaking the alarms state as there's no default one provided for my selectors.

Answer 1

Here were my issues:

After upgrading to ngrx 8, I didn't remove the @Effect() decorators from the effects I've transitioned to createEffect.

I removed {dispatch: false} from the effects (now using createEffect) instead of placing them as the second argument, after the arrow function.

Also see: Effect gets called twice when using StoreDevtoolsModule.instrument()