我正在尝试向 CKEditor5 的经典版本添加一个插件。我已按照此页面上的说明进行操作:https://ckeditor.com/docs/ckeditor5/latest/installation/plugins/installing-plugins.html https://ckeditor.com/docs/ckeditor5/latest/installation/plugins/installing-plugins.html
我可以说我已经正确完成了所有事情,因为当我打开时一切都按预期进行sample/index.html
.
现在是时候将此自定义构建与我的 React 应用程序集成了。
有关说明这一页 https://ckeditor.com/docs/ckeditor5/latest/builds/guides/integration/frameworks/react.html,“描述”要做什么:
您将在项目旁边的某个位置创建一个新构建,并包括
就像您包含了现有版本之一一样。
它说“像包含现有版本之一一样包含它”。好吧,这就是我包含经典构建的方式:
import React from "react";
import ReactDOM from "react-dom";
import CKEditor from "@ckeditor/ckeditor5-react";
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
import "./styles.css";
function App() {
return (
<div className="App">
<CKEditor
editor={ClassicEditor}
// Other Props
}}
/>
</div>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
所以,我假设我会做这样的事情:
import React from "react";
import ReactDOM from "react-dom";
import CKEditor from "@ckeditor/ckeditor5-react";
import ClassicEditor from './ckeditor/ckeditor'
import "./styles.css";
function App() {
return (
<div className="App">
<CKEditor
editor={ClassicEditor}
// Other Props
/>
</div>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
也就是说,只需更改import
声明来自:
import ClassicEditor from "@ckeditor/ckeditor5-build-classic";
to
import ClassicEditor from './ckeditor/ckeditor'
With ./ckeditor/ckeditor/
是ckeditor.js
文件中找到build
我的自定义构建的修改版本的文件夹。
但是,这是行不通的。新的 ckeditor.js 文件中没有导出。既不是默认导出,也不是命名导出。所以也许我应该像这样导入文件:
import './ckeditor/ckeditor'
但是我如何告诉 React 组件使用哪个编辑器。有一个editor
prop,它采用要使用的编辑器的名称 - 即:
<CKEditor
editor={ClassicEditor}
// Other Props
/>
所以我被困住了。我不知道如何将自定义构建包含到我的反应应用程序中。
有任何想法吗?
Thanks.