Skip to content
This repository was archived by the owner on Nov 27, 2019. It is now read-only.

Commit

Permalink
docs(store-devtools): Consistency fix
Browse files Browse the repository at this point in the history
  • Loading branch information
LukeHowellDev authored and brandonroberts committed Apr 26, 2018
1 parent aa3cfbf commit ead451b
Showing 1 changed file with 19 additions and 9 deletions.
28 changes: 19 additions & 9 deletions docs/store-devtools/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@
Devtools for [@ngrx/store](../store/README.md).

### Installation

Install @ngrx/store-devtools from npm:

`npm install @ngrx/store-devtools --save` OR `yarn add @ngrx/store-devtools`
Expand All @@ -12,11 +13,12 @@ Install @ngrx/store-devtools from npm:
`npm install github:ngrx/store-devtools-builds` OR `yarn add github:ngrx/store-devtools-builds`

## Instrumentation

### Instrumentation with the Chrome / Firefox Extension

1. Download the [Redux Devtools Extension](http://zalmoxisus.github.io/redux-devtools-extension/)
1. Download the [Redux Devtools Extension](http://zalmoxisus.github.io/redux-devtools-extension/)

2. In your `AppModule` add instrumentation to the module imports using `StoreDevtoolsModule.instrument`:
2. In your `AppModule` add instrumentation to the module imports using `StoreDevtoolsModule.instrument`:

```ts
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
Expand All @@ -28,35 +30,43 @@ import { environment } from '../environments/environment'; // Angular CLI enviro
// Instrumentation must be imported after importing StoreModule (config is optional)
StoreDevtoolsModule.instrument({
maxAge: 25, // Retains last 25 states
logOnly: environment.production // Restrict extension to log-only mode
})
]
logOnly: environment.production, // Restrict extension to log-only mode
}),
],
})
export class AppModule { }
export class AppModule {}
```

***NOTE:*** Once some component injects the `Store` service, Devtools will be enabled.

### Instrumentation options

When you call the instrumentation, you can give an optional configuration object:

#### `maxAge`

number (>1) | false - maximum allowed actions to be stored in the history tree. The oldest actions are removed once maxAge is reached. It's critical for performance. Default is `false` (infinite).

#### `logOnly`

boolean - connect to the Devtools Extension in log-only mode. Default is `false` which enables all extension [features](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#features).

#### `name`

string - the instance name to be showed on the monitor page. Default value is _NgRx Store DevTools_.

#### `monitor`:
#### `monitor`

function - the monitor function configuration that you want to hook.

#### `actionSanitizer`
function which takes `action` object and id number as arguments, and should return `action` object back.

function - takes `action` object and id number as arguments, and should return `action` object back.

#### `stateSanitizer`
function which takes `state` object and index as arguments, and should return `state` object back.

function = takes `state` object and index as arguments, and should return `state` object back.

#### `serialize`

false | configuration object - Handle the way you want to serialize your state, [more information here](https://github.com/zalmoxisus/redux-devtools-extension/blob/master/docs/API/Arguments.md#serialize).

0 comments on commit ead451b

Please sign in to comment.