在前端开发中，拼写检查期常常是一个必要的功能。而 @tommoor/electron-spellchecker 就是一个方便易用的拼写检查 npm 包。本文将详细介绍使用该包的方法，并提供一个实践示例。
1. 安装 @tommoor/electron-spellchecker 包
在使用 @tommoor/electron-spellchecker 前，我们需要先安装该包。在终端输入以下命令即可完成安装：
npm install --save @tommoor/electron-spellchecker
2. 使用 @tommoor/electron-spellchecker 包
首先，我们需要了解 @tommoor/electron-spellchecker 的基本使用方式。该包的主要功能是自动检查一个字符串的拼写，并返回所有的拼写错误。在 Electron 应用程序的渲染器进程（Render Process）中使用，也需要初始化 Remote 模块：
-- -------------------- ---- -------
----- ----------- - ---------------------------------
----- - ------ - - --------------------
-------------
--------------------- -----
------------------- ------
---
-------------------------------------------------------
------------ -
----------- ------------ ----------- --------
-
---上面的代码中，我们首先引入了 electron-context-menu 和 electron 两个模块。使用 contextMenu() 方法初始化上下文菜单，并使用 Remote 模块中的 @tommoor/electron-spellchecker 包来启动拼写检查器。该包的 init() 方法接受一个设置对象，可以指定一些选项和默认检查给定单词拼写错误建议的列表。
接下来，我们在一个函数中使用 @tommoor/electron-spellchecker 包的主要方法 getCorrectionsForMisspelling()，它可以检查一个字符串的拼写，并返回所有的拼写错误。示例代码如下：
-- -------------------- ---- -------
---
- -------------
- ------ -------- ---- -------
- -------- --------- --------------------
--
-------- ------------------- -
------ --- ----------------- ------- -- -
--- -
----- - ---------------------------- - - -------------------------------------------------
----- ------ - -----------------------------------
----------------
- ----- ------- -
--------------
-
---
-
-- ----
--------------------- --------------------- -- -
-------------------- -- --------- -------
---上面的代码中，我们定义了一个 checkSpelling() 函数，在该函数中使用 @tommoor/electron-spellchecker 包的 getCorrectionsForMisspelling() 方法检查给定字符串的拼写错误，并将结果以 Promise 的形式返回。在使用时，我们只需要传入待检查的字符串即可。
3. @tommoor/electron-spellchecker 包的高级使用
在许多情况下，一些特殊名称或术语需要被加到拼写检查的字典中，否则可能会误报。在使用 init() 方法时，我们可以指定一个额外的单词列表，来防止一些单词误报。示例代码如下：
remote.require('@tommoor/electron-spellchecker').init({
suggestions: {
'Electron': ['Electron', 'electron', 'Ionic'],
'Chromium': ['Chromium', 'Webkit', 'Blink', 'Gecko'],
'npm': ['npm', 'yarn', 'bower'],
},
isUTF16Encoded: true,
});在上面的代码中，我们使用 suggestions 选项指定了一些专有名词和术语，并将其与主单词一起提供给拼写检查程序。此外，你还可以使用 isUTF16Encoded 选项来指示待检查的文本是否以 UTF-16 编码。
4. 示例代码
在这里，我们提供一个完整的使用示例，该示例演示了如何使用 @tommoor/electron-spellchecker 包检查输入文本的拼写错误，并对错误提示进行了可视化处理：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------------------------------- ----------
-------
------ -
-------- -----
-
-- -
----------- -----
------------- --
-
-- -
------- --- --
-
----------- -
----------- -------
------ -----
-
--------
-------
------
---- --------------
------ -------------------------------
--------- ---------------------------
------
---- ---------------
---------
------
--------
----- ----------- - ---------------------------------
----- - ------ - - --------------------
-------------------------------------------------------
------------ -
----------- ------------ ----------- ---------
----------- ------------ --------- -------- ---------
------ ------- ------- ---------
-
---
-------- ------------------- -
------ --- ----------------- ------- -- -
--- -
----- - ---------------------------- - - -------------------------------------------------
----- ------ - -----------------------------------
----------------
- ----- ------- -
--------------
-
---
-
----- ----- - --------------------------------------
------------------------------- ----- ------- -- -
----- ---- - -------------------
----- ------ - ----- --------------------
----- ------ - ------------------------------- -----
---------------- - ---
-- -------------- - -- -
--- ------ ----- -- ------- -
----- -- - -----------------------------
----- ------ --------------- - ------
----- -------------- - -------------------------- -- ------ ------------------------------------------------- ---
------------ - -------- ----- --------------------- ----------------- ----------
-----------------------
-
- ---- -
----- -- - -----------------------------
-------------- - ------------
-----------------------
-
---
---------
-------
-------上面的代码中，我们首先引入了 electron-context-menu 和 electron 两个模块，并初始化了 @tommoor/electron-spellchecker 包来启动拼写检查器。之后，我们定义了一个 checkSpelling() 函数，它接受待检查的文本，并使用 getCorrectionsForMisspelling() 方法检查文本的拼写错误。检查结果以 Promise 的形式返回。
在 HTML 中，我们创建了一个用于输入待检查文本的 textarea 元素，并监听了其 input 事件，以实现拼写检查。当输入文本发生变化时，我们调用 checkSpelling() 函数进行拼写检查，并将结果呈现在页面中。下面是截图：
通过示例代码，我们可以清楚地了解如何使用 @tommoor/electron-spellchecker 包进行拼写检查，并将结果以可视化的方式展示在页面上。同时，本文还介绍了 init() 方法的高级使用方式，可以满足我们各种对拼写检查的需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005608181e8991b448deb55