ES6学习之 - ESLint 的使用

ESLint 是一个语法规则和代码风格的检查工具，可以用来保证写出语法正确、风格统一的代码。

首先，安装 ESLint。进入到当前project目录下：

//全局安装
$ npm i -g eslint

//针对workspace安装
$npm i eslint

然后初始化eslint：

//如果全局安装，执行：
$eslint --init

//如果是workspace范围，
//windows下执行：
$.\node_modules\.bin\eslint --init
//Linux或Mac下执行
./node_modules/.bin/eslint --init 

执行过程中需要你根据当前项目的实际情况进行选择：

PS C:\02.FrontendWorkspace\ES6> eslint --init
? How would you like to use ESLint? To check syntax and find problems
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? None of these
? Does your project use TypeScript? No
? Where does your code run? Browser
? What format do you want your config file to be in? JavaScript
Successfully created .eslintrc.js file in C:\02.FrontendWorkspace\ES6

最后提示成功创建一个叫做.eslintrc.js的文件，每个人的会有所差异，我的是这样的：

module.exports = {
    "env": {
        "browser": true,
        "es6": true
    },
    "extends": "eslint:recommended",
    "globals": {
        "Atomics": "readonly",
        "SharedArrayBuffer": "readonly"
    },
    "parserOptions": {
        "ecmaVersion": 2018,
        "sourceType": "module"
    },
    "rules": {
    }
};

以上，准备工作完成。下面通过ESLint验证，我随便验证了本地一个名字叫做array-testing.js的文件：

PS C:\02.FrontendWorkspace\ES6> eslint array-testing.js

C:\02.FrontendWorkspace\ES6\array-testing.js
  23:9   error  'arr' is assigned a value but never used  no-unused-vars
  28:47  error  'index' is defined but never used         no-unused-vars
  28:54  error  'array' is defined but never used         no-unused-vars
  31:52  error  'index' is defined but never used         no-unused-vars
  31:59  error  'array' is defined but never used         no-unused-vars

✖ 5 problems (5 errors, 0 warnings)

上面代码说明，原文件有五个错误，详细信息一看便知。