React使用slate-react引入Editor提示未导出报错如何解决？

你安装的slate@0.66.1、slate-react@0.66.1属于Slate 0.50版本重构后的迭代版本，原有0.4x及更早版本的API已经完全废弃：

• slate-react中的Editor组件已经更名，不再对外导出
• slate中的Value类也已被移除，不再支持Value.fromJSON初始化逻辑

有两种方案可选，任选其一即可：

方案1：适配新版本API重构代码（推荐） #

修改你的SlateEditor组件代码为新版本写法：

import React, { useState, useMemo } from "react";
import { createEditor } from "slate";
import { Slate, Editable, withReact } from "slate-react";

const SlateEditor = () => {    
  // 初始化编辑器实例
  const editor = useMemo(() => withReact(createEditor()), []);
  // 新版本初始值为直接定义的节点数组，无需使用Value类
  const initialValue = [
    {
      type: 'paragraph',
      children: [
        {
          text: 'A line of text in a paragraph.'
        }
      ]
    }
  ]

  const [ value, setValue ] = useState(initialValue)
  return (
      <div>
          {/* 外层用Slate组件传编辑器实例和状态，Editable组件负责可编辑区域渲染 */}
          <Slate editor={editor} value={value} onChange={newValue => setValue(newValue)}>
            <Editable className="Editor" />
          </Slate>
      </div>
  )
}
export default SlateEditor;

方案2：降级Slate相关依赖版本适配旧代码 #

如果你不想改动现有代码，可以将Slate相关依赖降级到支持旧API的版本：

1. 修改package.json中的依赖版本：

{
  "slate": "^0.47.9",
  "slate-react": "^0.22.9"
}

2. 删除项目中的node_modules文件夹、package-lock.json（或yarn.lock）文件
3. 重新执行npm install安装依赖即可

内容的提问来源于stack exchange，提问作者HardRock