引入@ngrx/store-devtools插件，可在浏览器中实时查看state状态的变化，而且还可以查看时间旅行

版本

Angular CLI：6.0.1
@ngrx/store：6.0.1
@ngrx/store-devtools：6.0.1

使用方法

首先安装包 npm install --save @ngrx/store-devtools

之后在app.modul.ts里面引入

...
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
...

...
imports: [
    BrowserModule,
    StoreModule.forRoot({
      tutorial: reducer
    }),
    StoreDevtoolsModule.instrument({
      maxAge: 25, // 要在历史记录树中存储的最大允许操作数
      logOnly: true, //将日志模式连接到Devtools扩展
    })
  ],
  ...

之后打开浏览器开发者工具中的redux选项。（注意：这个是安装的扩展，可搜索对应浏览器插件redux devtools）

小提示：如果谷歌浏览器显示不好使的问题，请换火狐浏览器。

开发服务器

运行 ng serve 启动服务. 访问 http://localhost:4200/.

devtools模块文档：

https://github.com/ngrx/platform/tree/master/docs/store-devtools