immer_1.enableAllPlugins is not a function 问题修复

在 umi 中设置 immer:true 后使用 formily 报错问题解决

报错截图

解决办法

使用 npm install 或者 yarn add 在 node_modules 目录下安装高版本 immer,使 node_modules 目录下的 immer是高版本的即可

需要知道的前置知识

  1. umi2 的 umi-plugin-react 插件设置 immer:true 即开启 umi 内置 immer ,可以更好地操作 reducer
  2. formily 使用了 immer ,且使用了 enableAllPlugins 函数,该函数只有在 6和6版本后才支持
    官方对enableAllPlugins 的声明
  3. node_modules 并不是只安装 package.json 中声明的依赖,会将第三方库所依赖的其他库也装到 node_modules 中
  4. node_modules 安装第三方库依赖的其他库时,若只有一个版本会安装在 node_modules 目录下,若有多个版本 node_modules 目录下会安装一个版本,将其他版本的分别安装在各自文件目录内 node_modules安装多个版本的依赖包
    图片中 node_modules 最顶层的的 immer 为 5.0.0 版本的,其他库依赖的 immer 分别安装在各自的node_modules 中,如 formily 是依赖 6.0.9 版本的 immer
  5. webpack 打包时,alise 提取公共路径,简化写法
    webpack 官方文档

问题原因

  1. 2018年有个PR,在开启 immer: true 时,导出了immer
    PR
    使用的是 alias 将使用 immer 的地方改成了 node_modules 目录下的 immer

  2. 导致所有依赖 immer 的地方经过 webpack 打包使用的只能是 node_modules 目录下的 immer 而非自己目录下的 immer

    • immer: true 开启后
      immer:true开启
    • immer: true 未开启
      没设置 immer: true
  3. 所以 formily 中使用的 immer 是 node_modules 目录下的,在本例子中即为 5.0.0 版本的

  4. 而 formily 使用的 enableAllPlugins 函数只有6版本或者6以上才支持

  5. 所以会报错 immer_1.enableAllPlugins is not a function

  6. 所以通过 npm 或者 yarn 安装 immer 后将 node_modules 目录下的 immer 版本改为 高版本的即可解决问题
    immer版本列表
    安装完成后,node_modules 目录下的 immer 是 7.0.7 版本的,而之前的 5.0.0 版本则安装到了 umi-plugin-ui 自己的目录下

注意事项

升级 immer 固然可以解决,但是同样会导致其他依赖低版本 immer 的库在运行时使用的是所安装的高版本 immer,若出现不兼容问题注意排查

友情链接

immer 官网 enableAllPlugins 的相关声明
umi2 的 umi-plugin-react 插件配置
immer: true 导出 immer pr

  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值