2020-08-06 23:39:05 +03:00
# Serialize ImmutableJS data
### Installation
```
2020-12-21 23:46:28 +03:00
yarn add @redux -devtools/serialize
2020-08-06 23:39:05 +03:00
```
### Usage with ImmutableJS data structures
Just pass the Immutable library to our class:
```js
import Immutable from 'immutable';
2022-01-10 18:41:53 +03:00
import { immutable } from '@redux-devtools/serialize';
const { stringify, parse } = immutable(Immutable);
2020-08-06 23:39:05 +03:00
const data = Immutable.fromJS({ foo: 'bar', baz: { qux: 42 } });
const serialized = stringify(data);
console.log(serialized);
// {"data":{"foo":"bar","baz":{"data":{"qux":42},"__serializedType__":"ImmutableMap"}},"__serializedType__":"ImmutableMap"}
const parsed = parse(serialized);
console.log(Immutable.is(parsed, data));
// true
```
See [the tests ](https://github.com/reduxjs/remote-devtools/blob/master/packages/remotedev-serialize/test/immutable.spec.js ) for more examples of usage.
### Usage with ImmutableJS Record classes
To parse a Record class back, you need to specify a reference to it:
```js
import Immutable from 'immutable';
2022-01-10 18:41:53 +03:00
import { immutable } from '@redux-devtools/serialize';
2020-08-06 23:39:05 +03:00
const ABRecord = Immutable.Record({ a: 1, b: 2 });
2022-01-10 18:41:53 +03:00
const { stringify, parse } = immutable(Immutable, [ABRecord]);
2020-08-06 23:39:05 +03:00
const myRecord = new ABRecord({ b: 3 });
const serialized = stringify(myRecord);
console.log(serialized);
// {"data":{"a":1,"b":3},"__serializedType__":"ImmutableRecord","__serializedRef__":0}
const parsed = parse(serialized);
console.log(Immutable.is(parsed, myRecord));
// true
```
### Passing custom serialization functions
You can pass custom replacer and reviver functions to Serialize:
```js
import Immutable from 'immutable';
2022-01-10 18:41:53 +03:00
import { immutable } from '@redux-devtools/serialize';
2020-08-06 23:39:05 +03:00
function customReplacer(key, value, defaultReplacer) {
if (value === 1) {
return { data: 'one', __serializedType__ : 'number' };
}
return defaultReplacer(key, value);
}
function customReviver(key, value, defaultReviver) {
if (
typeof value === 'object' & &
value.__serializedType__ === 'number' & &
value.data === 'one'
) {
return 1;
}
return defaultReviver(key, value);
}
2022-01-10 18:41:53 +03:00
const { stringify, parse } = immutable(
2020-08-06 23:39:05 +03:00
Immutable,
null,
customReplacer,
2023-07-12 21:03:20 +03:00
customReviver,
2020-08-06 23:39:05 +03:00
);
const map = Immutable.Map({ a: 1, b: 2 });
const serialized = stringify(map);
console.log(serialized);
// {"data":{"a":{"data":"one","__serializedType__":"number"},"b":2},"__serializedType__":"ImmutableMap"}
const parsed = parse(serialized);
console.log(Immutable.is(parsed, map));
// true
```
### Supported
#### ImutableJS
- [x] Record
- [x] Range
- [x] Repeat
- [x] Map
- [x] OrderedMap
- [x] List
- [x] Set
- [x] OrderedSet
- [x] Seq
- [x] Stack
#### ES6
- [x] Symbol
- [x] Map
- [x] Set
- [ ] Typed Array
### License
MIT