ESlint调研学习使用

https://eslint.org/ 安装下来用用,多掌握一些工具

功能

ESlint 是一款JavaScript代码检查工具,能够分析JavaScript源代码,找出其中的错误,节约debug时间。

同类型的工具还有 JSlint以及JShint,这两种工具使用的固定规则进行分析,而ESlint可以使用用户自定义的规则,适用于自己有一套独有的开发规则的团队或者是个人。保证可以写出语法正确,代码风格一致的代码。

能够自动开展以下工作

  • 发现错误
  • 执行规则
  • 订正错误

安装

Getting Start with ESlint

前置条件

需要已安装Node.js 版本要求 >=12.0.0,需要有SSL支持。(官方安装Node.js 自带SSL支持)

Node.js 入门 - 掘金

安装

# 使用 npm 或者 yarn
npm install eslint --save-dev
# OR
yarn add eslint --dev

注意,以上安装是安装到了本地,本地安装与全局安装的区别

简单来说,全局安装是可以让用户在命令行直接运行该组件包支持的命令,而本地安装是对于一个项目安装并配置一个Node模块。

不建议全局安装ESlint,即使全局安装了, 也需要本地安装才能使用插件或者是共享一些配置。

配置

npx命令解决了项目内安装模块的问题,通过这个命令可以在项目中本地初始化ESlint

参考资料:npx使用教程 - 阮一峰

# 生成对于该项目的配置文件
npx eslint --init

根据提示选择一系列配置之后,会在当前文件夹下创建 .eslintrc文件,在这个文件中会有相应的规则。

配置相关信息 - 官方文档

配置可以分为两种,配置注释配置文件,前者根据js文件中的注释进行配置,后者则根据上文提到的配置文件进行配置。

通过修改配置,可以控制ESlint处理代码的粒度。可以去配置以下内容

  • 运行环境(用什么解析器,处在什么环境下)
  • 指定一些全局变量(有特定的语法规则)
  • 配置第三方插件(需要提前通过npm安装,并在配置文件中声明plugins)
  • 配置规则(规则的状态(关闭,warningerror

官方文档写的很详细,这里就不细说了。

踩坑

node.js 安装版本

Ubuntu 上好像是没有自带 npm 包管理的,需要自己从 apt 中获取,可能会出现安装的npm以及nodejs版本与需要的不一致的现象,可以手动升级。

# 升级 npm 到最新版(自己安装自己
npm i -g npm
# 安装 npm 指定版本(可指定latest版本
npm i -g npm@6.4.1
npm i -g npm@latest

通过 npm 去更新 nodejs 的版本,可以下载一个 Node 的 n 工具包,里面提供了一些升级命令参数

# 安装 n 工具包
npm install n -g

# n 工具包中的一些升级命令
n # 显示现有的安装的Node的版本
n latest # 安装最新版本
n stable # 安装最新的稳定版本
n lts # 安装最新的LTS版
n version # 根据version参数给出的版本号安装

使用

命令行参数

命令行参数 - 官方文档

# 运行 ESlint 以检测js文件
eslint file1.js file2.js

命令行参数中可以设置的大致有:

  • 基本配置(配置文件是否启用,特定环境,全局变量,解析器
  • 指定规则
  • 指定插件
  • 是否解决发现的问题
  • 忽略文件(是否忽略,忽略哪些
  • 输入输出(标准输入输出,文件输入输出
  • 报告类型(仅报告错误,或者均报告
  • 缓存文件(保存缓存信息,使用缓存信息,指定缓存位置
  • 其他(初始化、调试、帮助

规则

官方规则列表

官方给出了比较详细的规则,至少在我看来还是挺详细的(自己对JavaScript了解太少了)

有很多规则是可以通过配置文件中的"extends": "eslint:recommended",直接进行开启的

也有很多规则是可以通过命令行参数 --fix设置:发现错误并直接订正(上文文档中有提及)

DEMO