Akita provides integration with the Redux dev-tools chrome extension.


Install the Redux extension from the supported App stores ( chrome, firefox ).

Install the devtools package.

npm i @datorama/akita-ngdevtools --save-dev
import { AkitaNgDevtools } from '@datorama/akita-ngdevtools';
imports: [environment.production ? [] : AkitaNgDevtools]
bootstrap: [AppComponent]
export class AppModule {}

Non-Angular Applications

import { akitaDevtools } from '@datorama/akita';


The plugin supports the following options passed as the second function parameter:

  • maxAge: Maximum amount of actions to be stored in the history tree.

  • actionsBlacklist: Disallow the passed actions.

  • actionsWhitelist: Allow only the passed actions.

  • storesWhitelist: Display only the passed stores.

  • logTrace: Whether to output a console.trace() for each action in the console.

  • shallow - Whether to perform a deep compare before showing an action.

  • sortAlphabetically

For example, by default Akita will notify you of every store initialization. You can prevent this by passing the following option:

import { DEVTOOLS_OPTIONS } from '@datorama/akita-ngdevtools';
useValue: { actionsBlacklist: ['@@INIT'] }

Custom Actions

By default, Akita will do its best to describe the actions that occurred, but you can always define your own actions for debugging purposes. For example:

import { action } from '@datorama/akita';
@action('Update filter')
updateFilter(filter: VISIBILITY_FILTER) {
ui: {

Or as a function:

import { logAction } from '@datorama/akita';
updateFilter(filter: VISIBILITY_FILTER) {
logAction('Update filter');

The custom actions will only be dispatched upon a store update.

Read about more dev-tools features here: