Atom 是一款在前端广受欢迎的代码编辑器，它有丰富的插件生态系统，使我们可以通过安装插件来扩展编辑器的功能。在这篇文章中，我将会教你如何使用一个非常有用的 npm 包 - atom-fecs，来提高你的代码风格检查质量。
atom-fecs 是什么？
atom-fecs 是一个基于 FEC 规范的 Atom 插件，它可以帮助我们在写代码时，遵循 FE 团队中关于代码风格的约定，而减少因代码风格不一致造成的错误以及团队内部的协作成本提高。具体 FE 规范请参考 FEC 规范。
atom-fecs 插件的特点：
- 支持多种编码风格检查，包括 js、html、css。
- 支持快捷键，可以一键执行检查命令。
- 支持自动修复非规范代码。
安装 atom-fecs
使用 atom-fecs 前，我们先要安装它。使用 Atom 插件管理器进行安装。
打开 Atom，打开「Preferences」菜单，选择「Install」标签。在搜索框中输入「atom-fecs」，找到这个插件，点击「install」进行安装。
使用 atom-fecs
安装完 atom-fecs 插件后，我们可以使用它提供的命令来进行代码风格检查和自动修复。
1. 代码风格检查
从 Atom 菜单栏选择「Packages」，找到「atom-fecs」插件，选择「Check File」或「Check Directory」，来执行代码风格检查。
Atom-fecs 插件可以检查多种文件格式中的风格，当然需要在 .fecs.js 配置中添加对应的配置，例如：check: ['js', 'html', 'htm', 'less', 'css'], 支持的文件类型包括：js, html, htm, css, less, json, md, markdown, compat.js，所有的命令都会使用 .fecs.js 中的配置。
在命令执行之后，插件会在代码中找出需要改进的地方，并在 Atom 中提供相应的标记，同时弹出错误列表。我们可以通过这种方式以相对独立的方式完成代码风格检查。
2. 自动修复非规范代码
atom-fecs 提供了修复非规范代码的快捷键 ctrl+alt+f，只需选中需要修复的部分，使用此快捷键即可自动修复这部分代码。
也可以通过 Package->atom-fecs->Auto Fix 来自动修复整个文件中不符合规范的代码。
atom-fecs 配置文件
atom-fecs 的配置文件分成两个部分：公共配置部分和对应类型的配置部分，即针对全部类型使用的配置和特定类型所使用的配置。
- common 配置项是针对所有文件的配置项
该文件默认名称是 .fecs.js，所在目录为当前项目的根目录，下面是一个简单的例子：
-- --------
-------------- - -
-- ----------
------ ------ ------- ------ ------- -------
-- ---- --------
--------- ---
-- ---------
-- - --- - ---- ------------- ----------------------
-- ----- ---- - --- ------- ---- ---------
---- ------
-- --------
-- ------ ----------
-- ------- -----------
-- -------- --------------
------ -------
-- ------- ----------------------------
----- ------------
-- --------------------
-------- ------
-- ---
-- 针对特定文件类型的部分配置
比如在 .fecs.js 中加入以下配置用以目录配置规范：
-- --------
-------------- - -
-- ---------
------ ------ ------- ------ ------- -------
-- -------------------
--- -
-- -- -- ----- --------------------- ---
------ -
-- -- --------------------- ---------
----------------- ------
-- ---
-
--
-- ---
-atom-fecs 配置模板
fecs-config.js 里面预设了项目里 *.fecs.js 文件的默认配置模板：至少需要配置两个规则。
require-file-start-with-module：所有 js 文件必须以一个 module.exports 字段为开头，防止非模块化代码污染全局环境。no-multi-assign：未建立的变量在赋值操作之前不能多次声明，防止代码过多变量浪费空间。
当然了，如果公司/团队内部有自定义的配置规则，可以在 .fecs.js 中针对需要 customize 的规则进行覆盖即可。
以上就是 atom-fecs 的使用教程，该插件可以帮助我们更好地遵循 FE 团队规定的代码风格，提高代码质量和协作效率。同时 atom-fecs 还提供了丰富的配置选项，有助于满足团队内部规范的多样性需求。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60055fcb81e8991b448dd50e