eslint使用教程_eslint --cache-程序员宅基地

技术标签: eslint  JavaScript  前端自动化  

简介

  • 检查语法错误
  • 检查语法风格
  • 修正语法

安装

//项目内安装
npm i -D eslint

//全局安装
npm i -g eslint

初始化配置

eslint --init

运行该命令将会在目录下生成一个.eslintrc(.js|.json|.yml)文件,该文件就是eslint规则的配置文件

实例

{
    "rules": {
        "semi": ["error", "always"],
        "quotes": ["error", "double"]
    }
}

"semi"和"quotes"就是ESLint中的配置规则名,[“error”, “always”]和[“error”, “double”]就是对应的配置,“error"参数代表该规则的错误等级,该等级有"off”,“warn”,"error"三种。"always"和"double"则是具体的配置项。

配置

环境

{
    "env": {
        "browser": true,
        "node": true
    }
}

可配置的环境还有:

  • browser - 浏览器全局变量。
  • node - Node.js全局变量和Node.js范围。
  • commonjs - CommonJS全局变量和CommonJS范围(将此用于使用Browserify / WebPack的仅浏览器代码)。
  • shared-node-browser - Node.js和Browser共有的全局变量。
  • es6- 启用除模块之外的所有ECMAScript 6功能(这会自动将ecmaVersion解析器选项设置为6)。
  • worker - worker全局变量。
  • amd- 根据amd规范定义require()和define()作为全局变量。
  • mocha - 添加所有Mocha测试全局变量。
  • jasmine - 为版本1.3和2.0添加了所有Jasmine测试全局变量。
  • jest - Jest全局变量。
  • phantomjs - PhantomJS全局变量。
  • protractor - Protractor全局变量。
  • qunit - QUnit全局变量。
  • jquery - jQuery全局变量。
  • prototypejs - Prototype.js全局变量。
  • shelljs - ShellJS全局变量。
  • meteor - meteor全球变量。
  • mongo - MongoDB全局变量。
  • applescript - AppleScript全局变量。
  • nashorn - Java 8 Nashorn全局变量。
  • serviceworker - serviceworker全局变量。
  • atomtest - atom test辅助全局变量。
  • embertest - Ember测试辅助全局变量。
  • webextensions - WebExtensions全局变量。
  • greasemonkey - GreaseMonkey全局变量。

配置插件

{
    "plugins": [
        "plugin1",
        "eslint-plugin-plugin2"
    ]
}

让一组文件不接受规则校验

{
  "rules": {...},
  "overrides": [
    {
      "files": ["*-test.js","*.spec.js"],
      "rules": {
        "no-unused-expressions": "off"
      }
    }
  ]
}

忽略一些文件

需要添加.eslintignore,内容格式如下:

**/*.js
**/*.js
**/*.js
**/*.js

配置扩展文件

{
    "rules":{...},
    "extends":"airbnb-base"
}

rules中的规则会覆盖扩展中的规则

命令行

在全局安装的情况下,可以使用eslint命令行

校验文件

eslint file.js

指定配置文件

eslint -c myconfig file.js

修复语法

eslint --fix file.js

将错误报告输出

eslint -f html file.js -o out.html

-o: 输出文件名
-f: 输出文件格式

可接受格式有:

  • checkstyle
  • codeframe
  • compact
  • html
  • jslint-xml
  • json
  • junit
  • stylish (the default)
  • table
  • tap
  • unix
  • visualstudio

有色输出

eslint --color file.js

添加缓存

eslint --cache file.js

会记录已经校验过的文件,优化eslint性能

规则

见官网:https://eslint.org/docs/rules/

扩展推荐

  • eslint-config-airbnb-base
  • eslint-config-standard
  • eslint-config-alloy
  • eslint-config-google
  • eslint-config-prettier
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/JianJianJianJianDe/article/details/87971717

智能推荐

QML ListView 实现 滚动条方式_qml listview滚动条-程序员宅基地

文章浏览阅读3.2k次。import QtQuick 2.0import QtQuick.Controls 2.1Rectangle { id: rect width: 1920 height:1180 color:"black" ListView { id: list_view anchors.fill:parent mod..._qml listview滚动条

Windows如何通过Anaconda定时调用python脚本_anaconda中的python怎么做定时调用-程序员宅基地

文章浏览阅读1.3k次。如果你用的是Anaconda环境下的python,先把.ipybn文件转为.py文件在win 搜索框输入: 任务计划程序_anaconda中的python怎么做定时调用

Laravel-admin 后台的自定义页面用法_laravel-admin $form->action-程序员宅基地

文章浏览阅读1.7w次。Laravel-admin 这个后台很好用,几乎省去了html和js的困扰,让后台CURD变得优雅简洁。这是一个自定义面的Demo路由定义: $router->get('mails/send', 'MailController@send'); $router->post('mails/send', 'MailController@send');控制中写法..._laravel-admin $form->action

flink sql读取kafka数据写入数据湖Apache Hudi_kafka队列 flink 数据湖-程序员宅基地

文章浏览阅读781次。创建生产者[bigdata@bigdata1 bin]$ sh kafka-console-producer.sh --broker-list bigdata1:9092,bigdata2:9092,bigdata3:9092 --topic test_topic>{"id":13,"name":"justin"}创建kafka表CREATE TABLE user_behavior ( id BIGINT, name STRING) WITH ( 'connecto._kafka队列 flink 数据湖

如何使用 Yahoo! Finance stock API 获取股票数据_yahoo finance api 下载数据-程序员宅基地

文章浏览阅读6.9k次。如何使用 Yahoo! Finance stock API 获取股票数据本站曾介绍过,通过代码添加雅虎财经的股票走势图到自己网站的方法(添加美国股市,添加沪深股市),调用的是一张图片。今天在德馨网站,看到了从雅虎财经频道获取股票数据的API(Yahoo! Finance stoc_yahoo finance api 下载数据

SpringMVC+Spring+Mybatis框架整合MQTT通信协议+ActiveMQ作为中间件进行消息的发布与订阅_mqtt +activemq-程序员宅基地

文章浏览阅读5.2k次,点赞2次,收藏17次。最近做了一个小项目,简单描述下项目结构,主要是java与单片机进行通信,为了实现通信可以采用中间件和http的方式,但是本人因为最近在学习ActiveMQ,所以更加偏向前者,最终确定了采用消息中间件的方式进行通信。 首先完成的步骤分为这两步: 1、单片机采用MQTT的通信协议将一个消息发送到一个消息中间件(本人采用ActiveMQ,也可以采用其他的消息中间件),这里需要注意下..._mqtt +activemq

随便推点

Sawyer机械臂学习系列之Moveit!配置_ros2 sawyer-程序员宅基地

文章浏览阅读1.6k次,点赞5次,收藏19次。Sawyer机械臂学习系列之Moveit!配置_ros2 sawyer

信噪比讨论(matlab加噪方式、案例分析)_信道加噪-程序员宅基地

文章浏览阅读9.2k次,点赞8次,收藏87次。信噪比讨论11 参数确定首先明确几个符号的意义 :S:信号的平均功率 ..._信道加噪

页面平滑过渡全屏切换-程序员宅基地

文章浏览阅读118次。实现效果为页面平滑过渡全屏切换,点击导航和鼠标滚动都可以切换。效果图:代码:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <meta http-..._页面 全屏 切换

Android中使用MD5对密码进行加密_安卓 用md5对用户密码进行加密的案例-程序员宅基地

文章浏览阅读4.9k次。Android中使用MD5对密码进行加密最近在做一个小小的项目,其中用到了登录和注册,登录注册的demo网上很多,这里就不详细描述,在注册新用户和登录时候,Android设备都要向服务器发送密码,为了用户的安全,密码一定不能明文发送,所以这里采用了MD5对密码进行加密,比较简单,直接看代码。在工程目录下先创建一个MD5类可以直接复制以下代码//此处导入你的包名import java.security_安卓 用md5对用户密码进行加密的案例

何时启用CheckPoint操作_什么时候启用checkpoint-程序员宅基地

文章浏览阅读1.2k次。1. 使用了有状态的transformation操作--比如updateStateByKey,或者reduceBykeyAndWindow操作,被使用了,那么checkpoint目录要求是必须提供的,也就是必须开启checkpoint机制,从而进行周期性的RDD checkpoint2. 要保证可以从Driver失败中进行恢复--元数据checkpoint需要启用,来进行这种情况的恢复要注意,并不..._什么时候启用checkpoint

VTK笔记——合并数据(vtkAppendPolyData)-程序员宅基地

文章浏览阅读4.8k次。数据的合并在3D应用中时常会用到,怎样合并数据,对于不同类型的数据,合并的方法却不相同。vtk中的数据集有很多类,主要包括结构化网络数据集、非结构化网络数据集、多边形数据集、结构化点集、线性网络数据集、非结构化点集等几类。_vtkappendpolydata

推荐文章

热门文章

相关标签