相关疑难解决方法(0)

CKEditor 5 如何在 Next.JS 上工作?

我有以下问题:

未处理的运行时错误错误:元素类型无效:需要字符串(对于内置组件)或类/函数(对于复合组件),但得到:未定义。您可能忘记从定义它的文件中导出组件,或者您可能混淆了默认导入和命名导入。检查 的渲染方法Resumos

这些不同的解决方案不起作用:

解决方案一:


import dynamic from "next/dynamic";

const { CKEditor } = dynamic(
  () => {
    return import('@ckeditor/ckeditor5-react');
  },
  { ssr: false }
);

const {ClassicEditor} = dynamic(
  () => {
    return import('@ckeditor/ckeditor5-build-classic');
  },
  { ssr: false }
);

const Resumos = ({id}) => {
  <CKEditor 
       editor={ ClassicEditor }
       data={textoResumoAluno}
       onChange={handleChangeTextoResumoAluno}
  />
}
Run Code Online (Sandbox Code Playgroud)

解决方案2:

const Resumos = ({id}) => {
    const editorRef = useRef()
    const [ editorLoaded, setEditorLoaded ] = useState( false )
    const { CKEditor, …
Run Code Online (Sandbox Code Playgroud)

javascript ckeditor reactjs next.js

4
推荐指数
1
解决办法
6996
查看次数

(Webpack) 当我尝试导入客户端库时,为什么会出现 ReferenceError: self is not defined in Next.js?

尝试在Next.js 中创建一个xterm react 组件时我被卡住了,因为我无法克服以前从未收到过的错误消息。

我正在尝试导入一个名为 的 npm 客户端模块xterm,但是如果我添加导入行,应用程序就会崩溃。

import { Terminal } from 'xterm'
Run Code Online (Sandbox Code Playgroud)

错误读取Server Error... ReferenceError: self is not defined 然后将此代码块显示为Source

module.exports = require("xterm");
Run Code Online (Sandbox Code Playgroud)

根据我所做的一些研究,这与 Webpack 有关,如果这样做会有所帮助:

output: {
  globalObject: 'this'
}
Run Code Online (Sandbox Code Playgroud)

你知道如何解决这个问题吗?先感谢您!

reactjs webpack electron next.js xtermjs

3
推荐指数
1
解决办法
3037
查看次数

标签 统计

next.js ×2

reactjs ×2

ckeditor ×1

electron ×1

javascript ×1

webpack ×1

xtermjs ×1