eslint 的三大通用规则详解


Posted in Javascript onMay 16, 2019

安装

可以全局安装,也可以在项目下面安装。 如下是在项目中安装示例,只需要在 package.json 中添加如下配置,并进行安装: >"eslint": "^4.11.0"

配置

配置方式有两种,但建议使用文件配置的形式,比较独立,便于维护。 使用文件配置的方式:在项目的根目录下,新建一个名为 .eslintrc 的文件,在此文件中添加一些检查规则。

文件配置方式

env:你的脚本将要运行在什么环境中

Environment可以预设好的其他环境的全局变量,如brower、node环境变量、es6环境变量、mocha环境变量等

'env': {
  'browser': true,
  'commonjs': true,
  'es6': true
 },

globals:额外的全局变量

globals: {
  vue: true,
  wx: true
 },

rules:开启规则和发生错误时报告的等级

规则的错误等级有三种:

  • 0或'off':关闭规则。
  • 1或'warn':打开规则,并且作为一个警告(并不会导致检查不通过)。
  • 2或'error':打开规则,并且作为一个错误 (退出码为1,检查不通过)。

参数说明:

  • 参数1 : 错误等级
  • 参数2 : 处理方式

配置代码注释方式

有时我们可能要在代码中忽略eslint的某种检查,或者加入某种特定检查,此时我们可以用如下的方式:

示例:

忽略 no-undef 检查
/* eslint-disable no-undef */

忽略 no-new 检查
/* eslint-disable no-new */

设置检查
/*eslint eqeqeq: off*/ /*eslint eqeqeq: 0*/

eslint 检查指令

检查且修复
eslint * --fix

检查指定文件
eslint app.js --fix

eslint官方提供了3种预安装包:

1、eslint-config-google

Google标准

执行安装:

npm install eslint eslint-config-google -g

2、eslint-config-airbnb

Airbnb标准,它依赖eslint, eslint-plugin-import, eslint-plugin-react, and eslint-plugin-jsx-a11y等插件,并且对各个插件的版本有所要求。

你可以执行以下命令查看所依赖的各个版本:

npm info "eslint-config-airbnb@latest" peerDependencies

你会看到以下输出信息,包含每个了每个plugins的版本要求

{ eslint: '^3.15.0',
 'eslint-plugin-jsx-a11y': '^3.0.2 || ^4.0.0',
 'eslint-plugin-import': '^2.2.0',
 'eslint-plugin-react': '^6.9.0' }

知道了每个plugins的版本要求后,代入以下命令执行安装即可使用:

npm install eslint-config-airbnb eslint@^#.#.# eslint-plugin-jsx-a11y@^#.#.# eslint-plugin-import@^#.#.# eslint-plugin-react@^#.#.# -g

3、eslint-config-standard

Standard标准,它是一些前端工程师自定的标准。

执行安装:

npm install eslint-config-standard eslint-plugin-standard eslint-plugin-promise -g

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
解决遍历时Array.indexOf产生的性能问题
Jul 03 Javascript
JavaScript实现下拉列表框数据增加、删除、上下排序的方法
Aug 11 Javascript
Jquery zTree 树控件异步加载操作
Feb 25 Javascript
JavaScript中闭包的写法和作用详解
Jun 29 Javascript
Bootstrap编写一个兼容主流浏览器的受众门户式风格页面
Jul 01 Javascript
JS生成不重复的随机数组的简单实例
Jul 10 Javascript
一个超简单的jQuery回调函数例子(分享)
Aug 08 Javascript
AngularJS实现ajax请求的方法
Nov 22 Javascript
微信小程序之swiper轮播图中的图片自适应高度的方法
Apr 23 Javascript
用POSTMAN发送JSON格式的POST请求示例
Sep 04 Javascript
Bootstrap的aria-label和aria-labelledby属性实例详解
Nov 02 Javascript
ECharts transform数据转换和dataZoom在项目中使用
Dec 24 Javascript
webpack项目使用eslint建立代码规范实现
May 16 #Javascript
Vue项目中使用jquery的简单方法
May 16 #jQuery
Vue CLI3创建项目部署到Tomcat 使用ngrok映射到外网
May 16 #Javascript
详解vue2.0模拟后台json数据
May 16 #Javascript
详解Vue-Router源码分析路由实现原理
May 15 #Javascript
微信小程序select下拉框实现效果
May 15 #Javascript
详解js常用分割取字符串的方法
May 15 #Javascript
You might like
关于文本留言本的分页代码
2006/10/09 PHP
PHP执行Curl时报错提示CURL ERROR: Recv failure: Connection reset by peer的解决方法
2014/06/26 PHP
实现PHP+Mysql无限分类的方法汇总
2015/03/02 PHP
PHP扩展迁移为PHP7扩展兼容性问题记录
2016/02/15 PHP
thinkPHP5实现的查询数据库并返回json数据实例
2017/10/23 PHP
javascript:void(0)的真正含义实例分析
2008/08/20 Javascript
ExtJS 2.0实用简明教程 之Border区域布局
2009/04/29 Javascript
jquery tab标签页的制作
2010/05/10 Javascript
基于JQuery的类似新浪微博展示信息效果的代码
2012/07/23 Javascript
博客侧边栏模块跟随滚动条滑动固定效果的实现方法(js+jquery等)
2013/03/24 Javascript
javascript属性访问表达式用法分析
2015/04/25 Javascript
Bootstrap轮播插件使用代码
2016/10/11 Javascript
JavaScript仿聊天室聊天记录
2016/12/27 Javascript
原生JavaScript创建不可变对象的方法简单示例
2020/05/07 Javascript
浅谈实现在线预览PDF的几种解决办法
2020/08/10 Javascript
[01:59]深扒TI7聊天轮盘语音出处 1
2017/05/11 DOTA
[原创]pip和pygal的安装实例教程
2017/12/07 Python
Python实现的当前时间多加一天、一小时、一分钟操作示例
2018/05/21 Python
在python中pandas的series合并方法
2018/11/12 Python
Python用61行代码实现图片像素化的示例代码
2018/12/10 Python
Python-openCV读RGB通道图实例
2020/01/17 Python
Python 去除字符串中指定字符串
2020/03/05 Python
numpy 矩阵形状调整:拉伸、变成一位数组的实例
2020/06/18 Python
Python实现邮件发送的详细设置方法(遇到问题)
2021/01/18 Python
西班牙第一的网上药房:PromoFarma.com
2017/04/17 全球购物
Marmot土拨鼠官网:美国专业户外运动品牌
2018/01/11 全球购物
C#里面如何判断一个Object是否是某种类型(如Boolean)?
2016/02/10 面试题
Unix/Linux开发面试题
2016/08/16 面试题
高中毕业自我鉴定
2013/12/19 职场文书
大学生饮食连锁店创业计划书
2014/01/17 职场文书
人事经理岗位职责范本
2014/08/04 职场文书
2014年安全工作总结范文
2014/11/13 职场文书
民事诉讼代理词
2015/05/25 职场文书
小学体育组工作总结
2015/08/13 职场文书
家长对孩子的寒假评语
2015/10/09 职场文书
个人道歉信大全
2019/04/11 职场文书