使用带有 redux 工具包的 immer `MapSet` 插件

Question

我有一些切片在它们的状态下使用 Sets。我有这个代码：

import { configureStore } from '@reduxjs/toolkit';
import { enableMapSet } from 'immer';
import { reducers } from './reducers';

enableMapSet();

export function configureStore() {
    const rootReducer = combineReducers({
        ...reducers,
    });

    return configureStore({
        reducer: rootReducer,
    });
}

const store = configureStore();
export type AppDispatch = typeof store.dispatch;
export default store;

尽管我安装了 immer 并调用了 enableMapSet()，但我的应用加载时仍然出现错误：

Unhandled Rejection (Error): [Immer] The plugin for 'MapSet' has not been loaded into Immer. To enable the plugin, import and call enableMapSet() when initializing your application.

我应该如何使用 Redux Toolkit 配置 enableMapSet？

Answer 1

这里有两个想法：

您的应用程序中可能有两个不同的 Immer 副本
话虽如此，you should not be putting non-serializable objects like Maps and Sets into the Redux state anyway，这就是我们一开始不打开 enableMapSet 的原因。

Answer 2

至少有助于我找出我遇到的问题，类似于 OP。

我已经在旧版本的 Redux 中存储 Maps 很长时间了，没有任何问题，我看到声明说你不应该在整个互联网上这样做，但它几乎没有理由。我偶尔看到的一个原因是它们不可序列化。但是，我不会将我的 Redux 状态保存到例如LocalStorage 所以可序列化问题似乎没有影响我。

为了解决 OP 的问题，鉴于接受的答案建议我的应用程序中可能存在多个 immer 版本，我转到 yarn.lock 文件查看哪个版本 @reduxjs/toolkit 取决于（7.0.3 截至 reduxjs/tookit@1.4.0）并确保我添加到我自己的 package.json 的那个是相同的。（yarn add immer 安装了比 Redux 使用的更新的 immer 版本）。

我做出更改后，我对 enableMapSet() 的调用消除了错误 OP，我做到了。

使用带有 redux 工具包的 immer `MapSet` 插件

Use immer `MapSet` plugin with redux toolkit

redux

immer.js

redux-toolkit