npm 包 janitorjs 使用教程

阅读时长 8 分钟读完

janitorjs 是一款基于 Node.js 的开源工具,能够帮助前端开发者更好地管理项目中的垃圾代码,提高项目的可维护性和可读性。

安装

安装 janitorjs 很简单,只需要在终端输入以下命令即可:

使用

使用 janitorjs 前,我们先来了解一些概念。

janitorjs 会将项目的所有文件视为节点,它会基于以下文件扩展名来决定文件的类型:

  • .js, .jsx, .vue: JavaScript 文件
  • .css, .scss: 样式文件
  • .html, .ejs: 模板文件

然后,janitorjs 会根据这些文件类型来按照一定的规则,找到垃圾代码并清理掉。目前支持的清理方法有:

  • 删除注释:清理掉 JavaScript 和 CSS 中的注释
  • 删除空格:清理掉 JavaScript 和 CSS 代码中的多余空格
  • 删除空行:清理掉 JavaScript 和 CSS 代码中的多余空行
  • 删除 console.log:清理掉 JavaScript 代码中的 console.log

以下是一个简单的例子:

-- -------------------- ---- -------
----- ------- - ---------------------

----- --- - ---------
  ----- ------------------
  ------ -
    ----------- ------------------- ---------------- ------------------ ------------------
    ---- ------------------- ---------------- -------------------
    ----- ------------------- ---------------- ------------------
  --
  ------- ---------------- ------- --------
---

----------

这段代码会扫描 path/to/project 目录下的所有文件,然后按照规则清理掉 JavaScript、CSS、HTML 中的垃圾代码。其中,rules 指定了清理规则,ignore 指定了需要忽略的目录,job.run() 则是启动清理任务。

高级用法

不同于上例中的快速入门,高级用法使用 janitor 类进行更加详细的配置,对项目底层进行更加智能的清除。

使用 janitor 类进行更加详细的配置

-- -------------------- ---- -------
----- ------- - ---------------------

----- ------- - --- ---------
  ----- ------------------
  ------- ---------------- ------- ---------
  ------ -
    ----------- ------------------- ---------------- ------------------ ------------------ ---------------- ------------------
    ---- ------------------- ---------------- -------------------
    ----- ------------------- ---------------- ------------------
  -
---

-------------------------------- -
  ------ -------------- --------
  ----- --------------
---

------------------------------- -
  ------ ---------------
  ----- --------------
---

--------------------------------- -
  ------ --------
  ----- --
---

-------------------------- -- -
  -------------------- ----------------
------------ -- -
  ------------------- -- -------- -----
---

------------------------- -- -
  ------------------- ----------------
------------ -- -
  ------------------- -- ------- -----
---

janitor 类支持对特定类型的文件清理和检查配置。上例中,明确了不同类型文件在清理和检查过程中需要遵守的规则。例如,.vue 文件在清理时需要同时清理其内部的 JavaScript 和 HTML,而在检查时只需要检查其中的 JavaScript。

自定义规则

janitorjs 提供了自定义规则的功能。这可以使得你更加方便地为项目添加定制化的垃圾代码清理规则。

-- -------------------- ---- -------
----- ------- - ---------------------

----- ------- - --- ---------
  ----- ------------------
  ------- ---------------- ------- ---------
---

------------------------------- -
  ------ ---------------
  ----- ---------------
  ------ -
    -------------------------- ------ -- -
      ------ --------------------------------------------------------- ----
    -
  -
---

-------------------------- -- -
  -------------------- ----------------
------------ -- -
  ------------------- -- -------- -----
---

------------------------- -- -
  ------------------- ----------------
------------ -- -
  ------------------- -- ------- -----
---

在这段代码中,我们为 js 文件类型添加了一个自定义规则:remove-unused-variables,由于项目需要使用 constlet 定义未来可能使用的变量,我们只需清理掉这些被赋值、但未被使用的变量。在 rules 属性的 remove-unused-variables 对象中,定义了用于清理变量的正则表达式,再次调用的 janitor.cleanAll()janitor.lintAll() 方法会自动按照刚才的规则执行清理和检查操作。

使用配置文件

使用配置文件可以使得 janitorjs 在配置管理上更加便捷。文件内可以描述出全局配置、每个规则的配置以及在不同情境下需要操作的代码类型。

在项目的跟目录下定义 janitor.config.js

-- -------------------- ---- -------
-------------- - -
  ----- ------
  ------ -
    ----------- -
      --------------- -----
      ------------- -----
      ----------------- -
        -------- ---------------------------------------------
        -------- --
      -
    --
    ---- -
      --------------- -----
      ------------- ----
    --
    ----- -
      --------------- -----
      ------------- ----
    -
  --
  ----------- -
    ---- -------------- --------
    --- ---------------
    ---- ------- -------
  --
  ------- ---------------- ------- --------
--
-- -------------------- ---- -------
----- ------- - ---------------------
----- ------ - ----------------------------
----- ------- - --- ----------------

-------------------------- -- -
  -------------------- ----------------
------------ -- -
  ------------------- -- -------- -----
---

------------------------- -- -
  ------------------- ----------------
------------ -- -
  ------------------- -- ------- -----
---

跟之前相比,主要变化在于使用 require 导入配置文件,而不再需要以配置函数的形式将配置放在 Janitor 的构造函数当中。

总结

janitorjs 是一款可以帮助你更好地管理项目中垃圾代码的工具,它可以帮助你更好地维护项目,并且让你的代码更加整洁易懂。janitorjs 提供了多种清理垃圾代码的规则以及自定义规则的功能。同时,针对特定的代码类型,也提供了不同的清理和检查规则。 在项目中使用 janitorjs,可以让代码更加规范、可读以及可维护。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/206400