如何在CKEditor 5中启用source editor(源码编辑器)选项?
CKEditor 5 经典构建版启用源码编辑器方法
CKEditor 5 官方默认提供的经典预构建包未集成源码编辑功能,需要手动添加SourceEditing插件完成配置,操作步骤如下:
- 插件安装
若使用npm包管理方式引入CKEditor,执行如下命令安装对应插件:npm install @ckeditor/ckeditor5-source-editing
若使用CDN引入,直接加载对应版本的SourceEditing插件资源即可。 - 配置注册插件
在编辑器初始化配置中完成插件注册和工具栏项添加,参考配置示例:import { ClassicEditor, SourceEditing } from 'ckeditor5'; ClassicEditor .create( document.querySelector('#editor'), { // 注册源码编辑插件 plugins: [ SourceEditing, /* 其余原有插件保持不变 */ ], // 工具栏添加源码编辑入口 toolbar: [ 'sourceEditing', /* 其余原有工具栏项保持不变 */ ] } ) .catch( error => console.error(error) );
注意:如果使用的是直接下载的官方预构建静态压缩包,需要通过CKEditor 5在线自定义构建工具勾选SourceEditing插件后重新生成构建包,替换现有资源后再按上述方式配置即可。
内容的提问来源于stack exchange,提问作者Selvavelan
相关产品推荐
相关产品推荐

