ckeditor5-helplink 是一个 npm 包，它为开发者提供了在 CKEditor5 内创建带有有用链接的帮助提示的能力。该包完全免费且易于使用，无论是新手还是经验丰富的开发者都可以获得很大的帮助。
安装和配置
首先，在你的项目目录中使用典型的 npm 安装方式来安装 ckeditor5-helplink：
npm install ckeditor5-helplink
完成之后，保存下面的代码为 ckeditor.js 以添加 ckeditor 到您的项目：
ClassicEditor
.create(document.querySelector('#editor'), {
plugins: [ Helplink ],
toolbar: [ 'helplink' ]
})
.catch(error => {
console.error(error);
});如果您想将 helplink 工具添加到工具栏上，需要在 CKEditor5 配置文件中添加如下代码：
toolbar: [ 'helplink' ]
按照此顺序，在创建 CKEditor5 实例时将 Helplink 插件添加到 plugins 数组中：
plugins: [ Helplink ]
使用教程
在你的编辑器中，任何文本都可以转化为一个可编辑的 CKEditor5 实例。现在，为了添加一个新的帮助链接，你需要在你的代码中加入 createHelplink 方法如下：
-- -------------------- ---- -------
---- -- -
------------------------------------------------------- -
-------- - -------- --
-------- - ---------- -
--
------ ------ -- -
------------------------- -------------- -- -- -
----- --------- - ------------------------------------------------
----- -------- - --------- -- --------------------
-- - -------- -- --------------- ------------------------------------ - - -
----- ------------ - -
----- ----------------------
----- ------------------------------------------------------------------
----- -------
-------- ----- --- ------------
--
--------------- ----------- ------------ --
-
---
--
------- ----- -- -
-------------- ----- --
---
---此示例利用 createHelplink 方法自动生成了一个带有必要图标和提示的帮助身份验证系统。
代码示例
下面是如何使用 ckeditor5-helplink 来创建带有自定义属性的帮助链接的示例代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------------- ---- ---- ------------
-------
------
------------ ---- ---- ---- ------------
--------- -----------------------
---- ------- -------- ---- --- ---
------- -----------------------------------------------------------------------------
------- -----------------------------------------------------------
---- ------- ------------------ ---
------- ----------------------------------------------------------------------------------------------------
--------
---- -- -
-------------
------------------------------------------ -
-------- - -------- --
-------- - ---------- -
--
------------ -- -
---------------------
---
---
---------
-------
-------此代码可以用于您的项目以及计算机中所有的现代浏览器。
总结
通过使用 ckeditor5-helplink 这个强大但简单的包，为您的项目添加帮助提示已经不是一件难事。上面的示例代码可以使您从头开始轻松获得这种能力，让您的用户更加舒适地使用您的应用程序。祝您成功！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/600671d630d0927023822bb0