fix: use immer will throw error in IE11 (#120)

* fix: use immer will throw error

* fix: fix lint

* fix: fix by the comment

* fix: fix lint error

* chore: update version

examples/counter/package.json

@@ -5,6 +5,7 @@
   "dependencies": {
     "@ice/store": "^1.3.4",
     "react": "^16.8.6",
+    "react-app-polyfill": "^1.0.6",
     "react-dom": "^16.8.6"
   },
   "devDependencies": {
@@ -23,12 +24,14 @@
     "production": [
       ">0.2%",
       "not dead",
-      "not op_mini all"
+      "not op_mini all",
+      "ie 11"
     ],
     "development": [
       "last 1 chrome version",
       "last 1 firefox version",
-      "last 1 safari version"
+      "last 1 safari version",
+      "ie 11"
     ]
   }
 }

examples/counter/src/index.tsx

@@ -1,15 +1,17 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { createStore } from '@ice/store';
+import 'react-app-polyfill/ie11';
+import 'react-app-polyfill/stable';
 
 const delay = (time) => new Promise((resolve) => setTimeout(() => resolve(), time));
 
 // 1️⃣ Use a model to define your store
 const counter = {
   state: 0,
   reducers: {
-    increment:(prevState) => prevState + 1,
-    decrement:(prevState) => prevState - 1,
+    increment: (prevState) => prevState + 1,
+    decrement: (prevState) => prevState - 1,
   },
   effects: () => ({
     async asyncDecrement() {
@@ -29,7 +31,7 @@ const store = createStore(models);
 // 3️⃣ Consume model
 const { useModel } = store;
 function Counter() {
-  const [ count, dispatchers ] = useModel('counter');
+  const [count, dispatchers] = useModel('counter');
   const { increment, asyncDecrement } = dispatchers;
   return (
     <div>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ice/store",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "description": "Simple and friendly state for React",
   "main": "lib/index.js",
   "files": [
@@ -72,4 +72,4 @@
     "redux": "^4.0.5",
     "redux-thunk": "^2.3.0"
   }
-}
+}

src/plugins/immer.ts

@@ -1,13 +1,16 @@
-import produce from 'immer';
+import produce, { enableES5 } from 'immer';
 import { combineReducers, ReducersMapObject } from 'redux';
 import * as T from '../types';
 
+// make it work in IE11
+enableES5();
+
 export interface ImmerConfig {
   blacklist?: string[];
 }
 
 function createCombineReducersWithImmer(blacklist: string[] = []) {
-  return function(reducers: ReducersMapObject) {
+  return function (reducers: ReducersMapObject) {
     const reducersWithImmer: ReducersMapObject<any, T.Action<any>> = {};
     // reducer must return value because literal don't support immer