在前端开发中，富文本编辑器是必不可少的组件。@ckeditor/ckeditor5-special-characters 是一个可用于 CKEditor5 中识别、插入特殊字符的 npm 包。本文将为大家详细介绍如何使用该 npm 包。
安装
使用 npm 安装 @ckeditor/ckeditor5-special-characters：
npm i --save @ckeditor/ckeditor5-special-characters
此外，为确保 @ckeditor/ckeditor5 版本与 @ckeditor/ckeditor5-special-characters 版本兼容，建议将两者一同安装：
npm i --save @ckeditor/ckeditor5-core @ckeditor/ckeditor5-special-characters
引入
在 CKEditor5 构建器中，将 @ckeditor/ckeditor5-special-characters 引入：
import SpecialCharacters from '@ckeditor/ckeditor5-special-characters/src/specialcharacters';
接着，通过 editorConfig.plugins 属性将其添加到 CKEditor5 的配置中：
ClassicEditor
.create( document.querySelector( '#editor' ), {
plugins: [ SpecialCharacters ],
toolbar: [ 'specialCharacters' ]
} )使用
特殊字符命令可通过 specialCharacters 值添加到 CKEditor5 工具栏中：
toolbar: [ 'specialCharacters' ]
单击工具栏中特殊字符图标，将会打开特殊字符窗口。
配置
特殊字符组件可以进行配置。例如，要添加新分类别的特殊字符，以及修改默认特殊字符分类别，将以下配置添加到 CKEditor5 的配置中：
-- -------------------- ---- -------
------------------ -
-- -------------
---------------- -------- -- ----------- ----------- --------------- -------------- -------- ----------------
-- ---------------------
------ -
- ------ ----- -------- ----- --------- ----- ---------------------- --------- ------- --
-
-在特殊字符窗口中，将显示前述添加的新特殊字符。如果想将自定义特殊字符分类别放到默认分类之外，需要单击对应分类别的 Title，在打开的面板中勾选“includeOther”。
示例代码
为便于理解，以下是完整的 CKEditor5 配置示例代码：
-- -------------------- ---- -------
------ ------------- ---- ------------------------------------
------ ----------------- ---- ---------------------------------------------------------------
-------------
-------- ----------------------- --------- -- -
-------- - ----------------- --
-------- - ------------------- --
------------------ -
-- -------------
---------------- -------- -- ----------- ----------- --------------- -------------- -------- ----------------
-- ---------------------
------ -
- ------ ----- -------- ----- --------- ----- ---------------------- --------- ------- --
-
--
- -
------- ----- -- -
-------------- ----- --
- --希望本文对您学习 @ckeditor/ckeditor5-special-characters npm 包的使用有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5f3209b43b0ab45f74a8bd4d