除非安装了Redux Devtools,否则ngrx Angular应用程序将无法运行

时间:2018-08-21 10:06:16

标签: angular ngrx redux-devtools

我们的ngrx Angular应用程序运行良好,直到我们卸载Redux Devtools为止,此时会出现错误:

  

您提供了一个无效的对象,该对象应在其中流。您可以提供一个Observable,Promise,Array或Iterable。

app.module.ts中的商店设置如下:

StoreModule.forRoot(reducers, {metaReducers}),
!environment.production ? StoreDevtoolsModule.instrument() : [],
EffectsModule.forRoot([SimsEffects, FiltersEffects, OmnipresentEffects, UserEffects, InitEffects]),
StoreRouterConnectingModule.forRoot({stateKey: 'router'})

和我们的ngrx reducers / index.ts文件如下:

export interface AppState {
  router: any,
  omnipresent: OmnipresentState,
  user: UserState
}

export const reducers: ActionReducerMap<AppState> = {
  router: routerReducer,
  omnipresent: omnipresentReducer,
  user: userReducer
}

export function resetStore(reducer) {
  return (state, action) => {
    return reducer(action.type === InitActionTypes.ResetStore ? undefined : state, action)
  }
}

// storeFreeze throws an error early if state is mutated, avoiding hard to debug state mutation issues
export const metaReducers: MetaReducer<AppState>[] = !environment.production ? [resetStore, storeFreeze] : [resetStore] // tslint:disable-line array-type

任何人都曾经经历过此事或知道解决方法?开发人员和产品环境中都存在该问题。

我们正在运行Node v8.11.3

编辑:如果我注释掉这一行,错误消失了,但是显然商店无法初始化:

@Effect()
init$: Observable<any> = defer(() => {
  return of(new InitAction())
})

其中InitAction只是一个不执行任何操作且不附带任何效果的操作(目的是帮助调试此操作)。

2 个答案:

答案 0 :(得分:1)

更改此设置即可解决

import { defer, of } from 'rxjs/index' // as per my IDE suggestions

收件人:

import { defer, of } from 'rxjs' // as per ngrx docs

此外,将所有对“ rxjs / index”的引用替换为“ rxjs”

答案 1 :(得分:1)

就我而言,问题是https://github.com/angular/angular/issues/25837

在未安装NGRX devtools的情况下(不确定为什么),某些部分的导航被认为在NgZone之外(这实际上是因为某些Google SDK回调调用了该导航)。如果devtools正确安装,则不会发生。

问题在于控制台中未引发任何错误,必须启用详细日志才能看到警告。 通过包装在NgZone中解决。运行调用:

constructor(private ngZone: NgZone) {}

this.ngZone.run(() => this.store.dispatch(buildAuthStartAction(user)));