Redux Immutable

redux-immutable is used to create an equivalent function of Redux combineReducers that works with Immutable.js state.
Alternatives To Redux Immutable
Project NameStarsDownloadsRepos Using ThisPackages Using ThisMost Recent CommitTotal ReleasesLatest ReleaseOpen IssuesLicenseLanguage
Js Stack From Scratch19,3962a year ago1January 19, 201748mitJavaScript
🛠️⚡ Step-by-step tutorial to build a modern JavaScript stack.
Connected React Router4,7312,0667199 months ago51July 11, 2022175mitJavaScript
A Redux binding for React Router v4
5 years ago17mitJavaScript
:snowflake: A React-Native Android iOS Starter App/ BoilerPlate / Example with Redux, RN Router, & Jest with the Snowflake Hapi Server running locally or on RedHat OpenShift for the backend, or a Parse Server running locally or remotely on Heroku
3 years ago58otherJavaScript
從零開始學 ReactJS(ReactJS 101)是一本希望讓初學者一看就懂的 React 中文入門教學書,由淺入深學習 ReactJS 生態系 (Flux, Redux, React Router, ImmutableJS, React Native, Relay/GraphQL etc.)。
Redux Simple Tutorial2,543
3 years ago1
Redux 莞式教程。本教程深入浅出,配套入门、进阶源码解读以及文档注释丰满的 Demo 等一条龙服务
Redux Immutable1,8803,7246072 years ago33March 14, 20179otherTypeScript
redux-immutable is used to create an equivalent function of Redux combineReducers that works with Immutable.js state.
Battle City1,562
2 years ago10mitTypeScript
🎮 Battle city remake built with react.
Chat Buy React1,027
2 years ago25gpl-3.0JavaScript
Client for beginners to learn, built with React / Redux / Node
Redux Immutablejs6885601074 years ago8December 17, 201512bsd-3-clauseJavaScript
Redux Immutable facilities.
Redux Storage682317 years ago1July 16, 20163mitJavaScript
Persistence layer for redux with flexible backends
Alternatives To Redux Immutable
Select To Compare

Alternative Project Comparisons


GitSpo Mentions Travis build status NPM version Canonical Code Style

redux-immutable is used to create an equivalent function of Redux combineReducers that works with Immutable.js state.

When Redux createStore reducer is created using redux-immutable then initialState must be an instance of Immutable.Collection.


When createStore is invoked with initialState that is an instance of Immutable.Collection further invocation of reducer will produce an error:

The initialState argument passed to createStore has unexpected type of "Object". Expected argument to be an object with the following keys: "data"

This is because Redux combineReducers treats state object as a plain JavaScript object.

combineReducers created using redux-immutable uses Immutable.js API to iterate the state.


Create a store with initialState set to an instance of Immutable.Collection:

import {
} from 'redux-immutable';

import {
} from 'redux';

const initialState = Immutable.Map();
const rootReducer = combineReducers({});
const store = createStore(rootReducer, initialState);

By default, if state is undefined, rootReducer(state, action) is called with state = Immutable.Map(). A different default function can be provided as the second parameter to combineReducers(reducers, getDefaultState), for example:

const StateRecord = Immutable.Record({
	foo: 'bar'
const rootReducer = combineReducers({foo: fooReducer}, StateRecord);
// rootReducer now has signature of rootReducer(state = StateRecord(), action)
// state now must always have 'foo' property with 'bar' as its default value

When using Immutable.Record it is possible to delegate default values to child reducers:

const StateRecord = Immutable.Record({
	foo: undefined
const rootReducer = combineReducers({foo: fooReducer}, StateRecord);
// state now must always have 'foo' property with its default value returned from fooReducer(undefined, action)

In general, getDefaultState function must return an instance of Immutable.Record or Immutable.Collection that implements get, set and withMutations methods. Such collections are List, Map and OrderedMap.

Using with react-router-redux v4 and under

react-router-redux routeReducer does not work with Immutable.js. You need to use a custom reducer:

import Immutable from 'immutable';
import {
} from 'react-router-redux';

const initialState = Immutable.fromJS({
  locationBeforeTransitions: null

export default (state = initialState, action) => {
  if (action.type === LOCATION_CHANGE) {
    return state.set('locationBeforeTransitions', action.payload);

  return state;

Pass a selector to access the payload state and convert it to a JavaScript object via the selectLocationState option on syncHistoryWithStore:

import {
} from 'react-router';
import {
} from 'react-router-redux';

const history = syncHistoryWithStore(browserHistory, store, {
  selectLocationState (state) {
      return state.get('routing').toJS();

The 'routing' path depends on the rootReducer definition. This example assumes that routeReducer is made available under routing property of the rootReducer.

Using with react-router-redux v5

To make react-router-redux v5 work with Immutable.js you only need to use a custom reducer:

import {
} from 'immutable';
import {
} from 'react-router-redux';

const initialState = Map({
  location: null,
  action: null

export function routerReducer(state = initialState, {type, payload = {}} = {}) {
  if (type === LOCATION_CHANGE) {
    const location = payload.location || payload;
    const action = payload.action;

    return state
      .set('location', location)
      .set('action', action);

  return state;

Popular Immutablejs Projects
Popular Redux Projects
Popular Computer Science Categories
Related Searches

Get A Weekly Email With Trending Projects For These Categories
No Spam. Unsubscribe easily at any time.