ESLint入门指南

197 阅读2分钟

「这是我参与2022首次更文挑战的第23天,活动详情查看:2022首次更文挑战」。

ESLint是什么?

官网上说的是,ESLint 是在 ECMAScript/JavaScript 代码中识别和报告模式匹配的工具,它的目标是保证代码的一致性和避免错误。

这个怎么理解呢?

一般来说,每个程序员都会有自己的编码习惯。比如有的人代码结尾一定会加分号;,而有的人则习惯不加。

如果是个人开发,没什么问题。但是当团队协作开发时,每个如果都按自己的习惯来,那么项目代码就会很混乱。

ESLint就是用来处理这种问题的工具,它可以做两个事情

  • 首先允许你自定义一套编码规范;
  • 之后会根据你提前制定的规范来检验你写的代码是否符合制定的规范;

ESLint配置文件

ESLint的规范会写在配置文件中,如果在项目中看到 .eslintrc.js ,它就是ESLint 的配置文件。

ESLint 支持几种格式的配置文件,具体可以看👉ESLint配置文件介绍

在ESLint配置文件中,你可以配置

Environments

指定脚本的运行环境。每种环境都有一组特定的预定义全局变量。

如以下代表启用了 browser 和 Node.js 的环境

image-20220221235342807

👉 更多环境

Globals

脚本在执行期间访问的额外的全局变量。

Rules

启用的规则及其各自的错误级别。在配置文件的rules中可以看到有许多这样的规则。

image-20220221234100997

规则对象的key,是规则的名称,第一个值是错误级别,它的可能是

  • "off" or 0 - 关闭规则
  • "warn" or 1 - 将规则视为一个警告(不会影响退出码)
  • "error" or 2 - 将规则视为一个错误 (退出码为1)

👉 规则名称大全

结尾

一份Eslint👉示例

参考资料:ESLint中文文档


🎨【点赞】【关注】不迷路,更多前端干货等你解锁

往期推荐

👉 一起来看看JS的原型继承

👉 15 个JavaScript数组实用技巧

👉 JavaScript数组方法看这一篇就够了

👉 JS内置日期对象Date的使用指南