npm 包 @36node/eslint-config 使用教程

阅读时长 4 分钟读完

介绍

@36node/eslint-config 是一款前端开发常用的 ESLint 配置包,主要用于规范 JavaScript 代码的书写。该包基于 eslintprettier 进行了自定义配置,在代码书写过程中能够发现代码中的错误和不规范的写法,并给出相应的提示和解决方案。该包已在多个项目中实际使用,并得到了良好的反馈。

安装

使用 npm 安装该包:

使用

配置文件

安装完成后,在项目的根目录下创建 .eslintrc.js 文件,并填入以下代码:

其中,extends 指定了使用的 eslint 配置,@36node/eslint-config 表示使用该包的配置。rules 可以用来添加和覆盖已有的规则,例如:

以上配置中,我们关闭了 no-console 规则,运行时可以使用 console

在命令行中使用

该包也可以直接在命令行使用,命令为:

其中,<files...> 表示需要检测的文件或目录。

例如,我们想要检测 src 目录下所有的 JavaScript 文件,可以运行以下命令:

在 VS Code 中使用

在 VS Code 中使用该包,需要安装 eslint 插件,并在工作空间的 settings.json 文件中添加以下配置:

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

以上配置中,editor.formatOnSave 表示在保存文件的时候格式化代码,editor.codeActionsOnSave 中的配置会在保存文件的时候自动修复 eslint 的错误,eslint.validate 指定了需要检测的文件类型。

示例代码

以下是一段使用了该包的示例代码:

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

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

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

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

在 VS Code 中,以上代码会被自动格式化并修复一些错误,如下图所示:

总结

通过使用 @36node/eslint-config 包,我们可以方便地在项目中使用 eslint,并规范代码书写。在不同的开发场景中,我们可以使用不同的 eslint 配置,以达到更高效地开发和更高质量的代码。

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