Plugin with integration with the Redux Devtools extension.
npm install @ngxs/devtools-plugin --save-dev​# or if you are using yarnyarn add @ngxs/devtools-plugin --dev
Add the NgxsReduxDevtoolsPluginModule
plugin to your root app module:
import { NgxsModule } from '@ngxs/store';import { NgxsReduxDevtoolsPluginModule } from '@ngxs/devtools-plugin';​@NgModule({imports: [NgxsModule.forRoot([]), NgxsReduxDevtoolsPluginModule.forRoot()]})export class AppModule {}
The plugin supports the following options passed via the forRoot
method:
name
: Set the name by which this store instance is referenced in devtools (Default: 'NGXS')
disabled
: Disable the devtools during production
maxAge
: Max number of entries to keep.
actionSanitizer
: Reformat actions before sending to dev tools
stateSanitizer
: Reformat state before sending to devtools
You should always include the devtools as the last plugin in your configuration. For instance, if you were to include devtools before a plugin like the storage plugin, the initial state would not be reflected.