2

我正在使用 Angular 5 + NgRx 开发应用程序。我安装了浏览器扩展 Redux DevTools（适用于 Chrome 和 Firefox）。但两个扩展都被禁用（图标为灰色且不显示商店历史记录）

我的应用程序有几个模块，它们是异步加载的。主 app.module.ts 包含此代码

StoreModule.forRoot({
 user: userReducer
})

另一个模块有这个

StoreModule.forFeature('dashboard', dashboardReducer),
StoreModule.forFeature('globalSettings', globalSettingsReducer),
StoreModule.forFeature('userInfo', userSettingsReducer),

结果是 Redux DevTools 扩展被禁用。控制台中没有报告任何相关错误。我究竟做错了什么？我无法让它工作，我感到很沮丧。

当我把它改成这个（显然是错误的）代码时，有趣的是，DevTools 又开始工作了，但是其他的东西坏了（正如预期的那样）

StoreModule.forRoot({
 'dashboard': dashboardReducer,
 'globalSettings': globalSettingsReducer,
 'userInfo': userSettingsReducer
}),

我确实需要 DevTools 才能工作，因为它可以帮助我更好地处理/可视化应用程序的当前状态。同样没有 Redux DevTools 和时间旅行调试，整个 Redux 方法在我看来就像编写太多样板文件。当工具生态系统工作时，它会很棒，但当它崩溃时，我所拥有的只是更多样板代码（reducers、actions 等）。

为什么 Redux DevTools 无法启动？为什么它不向控制台报告任何错误？如何让它再次工作？

PS：我没有使用 Redux DevTools 的 npm 包，我使用的是 @ngrx/store 提供的原始存储。它曾经工作正常，直到我添加了 .forFeature() 调用。

请指教

4

1 回答 1

0

啊啊，所以解决方案是在 MAIN 模块（通常称为 app.module）中初始化 StoreDevtoolsModule。如果您在稍后加载的其他模块中对其进行初始化，那么它将以荒谬的方式表现（请参阅我的原始问题）

所以解决方案是StoreDevtoolsModule.instrument({ maxAge: 25 })从异步加载模块移动到主 app.module。之后，它再次像魅力一样工作。

但对我来说，作为这个项目的新手，之前已经设置了 DevTools，完全不明白为什么它突然停止工作。

于 2018-02-27T13:37:35.493 回答