首页 > 语言 > JavaScript > 正文

EsLint入门学习教程

2024-05-06 15:11:17
字体:
来源:转载
供稿:网友

介绍

ESLint 由 JavaScript 红宝书 作者 Nicholas C. Zakas 编写, 2013 年发布第一个版本。 NCZ 的初衷不是重复造一个轮子,而是在实际需求得不到 JSHint 团队响应 的情况下做出的选择:以可扩展、每条规则独立、不内置编码风格为理念编写一个 lint 工具。

官方地址:http://eslint.org/

EsLint帮助我们检查Javascript编程时的语法错误。比如:在Javascript应用中,你很难找到你漏泄的变量或者方法。EsLint能够帮助我们分析JS代码,找到bug并确保一定程度的JS语法书写的正确性。

EsLint是建立在Esprima(ECMAScript解析架构)的基础上的。Esprima支持ES5.1,本身也是用ECMAScript编写的,用于多用途分析。EsLint不但提供一些默认的规则(可扩展),也提供用户自定义规则来约束我们写的Javascript代码。

EsLint提供以下支持:

ES6 AngularJS JSX Style检查 自定义错误和提示

EsLint提供以下几种校验:

语法错误校验 不重要或丢失的标点符号,如分号 没法运行到的代码块(使用过WebStorm的童鞋应该了解) 未被使用的参数提醒 漏掉的结束符,如} 确保样式的统一规则,如sass或者less 检查变量的命名

使用

一、安装

Npm install gulp-eslint –save-dev

在你的项目目录下,运行:eslint –init将会产生一个.eslintrc的文件,文件内容包含一些校验规则

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

其中”semi”和”quotes”是规则名称。EsLint还提供了error的级别,对应数字,数字越高错误的提示越高,如0代码错误不提示、1代表警告提醒但不影响现有编译、2error会抛出错误。

"extends": "eslint:recommended"

Extends是EsLint默认推荐的验证,你可以使用配置选择哪些校验是你所需要的,可以登录npmjs.com查看

二、自定义配置EsLint

之前提到你可以关掉所有EsLint默认的验证,自行添加所确切需要的验证规则。为此EsLint提供了2个种方式进行设置:

    Configuration Comments: 在所要验证的文件中,直接使用Javascript注释嵌套配置信息 Configuration Files: 使用JavaScript、JSON或YAML文件,比如前面提到的.eslintrc文件,当然你也可以在package.json文件里添加eslintConfig字段,EsLint都会自动读取验证。

开始介绍EsLint的用法

parserOptions

EsLint通过parserOptions,允许指定校验的ecma的版本,及ecma的一些特性

{ "parserOptions": {  "ecmaVersion": 6, //指定ECMAScript支持的版本,6为ES6  "sourceType": "module", //指定来源的类型,有两种”script”或”module”  "ecmaFeatures": {   "jsx": true//启动JSX  }, }}            
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选