React项目slate-react导入Editor提示无默认导出报错如何解决？

• 你使用的是 0.50及以上版本的slate、slate-react，该版本是官方重构后的大版本，彻底调整了API规则，和旧版本完全不兼容：
  • 取消了所有默认导出，所有API、组件均改为命名导出
  • 废弃了原有的Value相关API，移除了Value.fromJSON方法
  • 原Editor组件也被拆分替换为Slate上下文组件和Editable渲染组件

你遇到的导入报错就是因为新版slate-react不存在默认导出，无法通过import Editor from 'slate-react'的方式引入组件。

方案1：降级到兼容旧API的版本（适合维护老项目） #

直接安装0.4x分支的稳定版本，原有代码不需要做任何修改即可正常运行：

npm install slate@0.47 slate-react@0.22
# 或使用yarn
yarn add slate@0.47 slate-react@0.22

方案2：适配新版本API写法（适合新项目开发） #

修改TextEditor.js的代码为新版本规范，示例如下：

import React, { useMemo, useState } from 'react'
// 改为命名导出，引入新版所需组件和API
import { createEditor } from 'slate'
import { Slate, Editable, withReact } from 'slate-react'

export default function TextEditor() {
  // 初始化编辑器实例
  const editor = useMemo(() => withReact(createEditor()), [])
  // 初始内容直接用JSON格式定义，无需调用Value.fromJSON
  const [value, setValue] = useState([
    {
      type: 'paragraph',
      children: [{ text: 'A line of text in a paragraph.' }],
    },
  ])

  return (
    <Slate editor={editor} initialValue={value} onChange={newValue => setValue(newValue)}>
      <Editable />
    </Slate>
  )
}

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