https://eslint.org/
http://eslint.cn/docs/rules/
http://eslint.cn/demo/
http://eslint.cn/docs/user-guide/configuring#extending-configuration-files

命令行使用篇

  1. npm install -g eslint
  2. eslint --init
  3. eslint yourfile.js

npm init // 必须先创建package.json的配置文件
>eslint —init

一,检查的类型

To check syntax only 仅检查语法
>To check syntax and find problems 检查语法并找出问题
>To check syntax, find problems, and enforce code style 检查语法、发现问题和强制代码样式
image.png

二,您的项目使用什么类型的模块？

What type of modules does your project use? 您的项目使用什么类型的模块？
❯ JavaScript modules (import/export) javascript模块（导入/导出）
CommonJS (require/exports) CommonJS（需要/导出）
None of these 这些都不是
image.png

三,您的项目使用哪个框架？

Which framework does your project use? (Use arrow keys) 您的项目使用哪个框架？（使用箭头键）
❯ React
Vue.js
None of these 这些都不是
image.png

四 你的代码在哪里运行

Where does your code run? (Press to select, to toggle all, to
invert selection) 你的代码在哪里运行
❯◉ Browser
◯ Node

image.png

五,您希望如何为项目定义样式？

How would you like to define a style for your project? (Use arrow keys) 您希望如何为项目定义样式？（使用箭头键）
❯ Use a popular style guide 使用流行的风格指南
Answer questions about your style 回答关于你的风格的问题
Inspect your JavaScript file(s) 检查您的javascript文件
image.png

六，输出的配置文件格式

What format do you want your config file to be in? (Use arrow keys) 您希望配置文件采用什么格式？
❯ JavaScript
YAML
JSON
image.png

  1. // package.json
  2. {
  3.   "name": "test",
  4.   "version": "1.0.0",
  5.   "description": "",
  6.   "main": "index.js",
  7.   "scripts": {
  8.     "test": "echo \"Error: no test specified\" && exit 1"
  9.   },
  10.   "author": "",
  11.   "license": "ISC",
  12.   "devDependencies": {
  13.     "eslint": "^5.15.1",
  14.     "eslint-config-google": "^0.12.0",
  15.     "eslint-plugin-vue": "^5.2.2"
  16.   }
  17. }

组态

注意：如果您来自1.0.0之前的版本，请参阅迁移指南。
运行后eslint --init，您.eslintrc的目录中将有一个文件。在其中，您将看到一些配置如下的规则：

  1. {
  2.     "rules": {
  3.         "semi": ["error", "always"],
  4.         "quotes": ["error", "double"]
  5.     }
  6. }

名称"semi"和"quotes"是ESLint 中规则的名称。第一个值是规则的错误级别，可以是以下值之一：

  • "off"或0- 关闭规则
  • "warn"或1- 将规则作为警告打开（不影响退出代码）
  • "error"或2- 将规则作为错误打开（退出代码为1）

三个错误级别允许您对ESLint如何应用规则进行细粒度控制（有关更多配置选项和详细信息，请参阅配置文档）。
您的.eslintrc配置文件还将包含以下行：

  1. "extends": "eslint:recommended"

由于这条线，所有规则都标有““将在规则页面上打开。另外，您也可以使用别人通过搜索的“eslint-配置”创建配置npmjs.com。除非您从共享配置扩展或在配置中明确启用规则，否则ESLint不会丢失您的代码。

  1. // .eslintrc.js
  2. module.exports = {
  3.     "env": {
  4.         "browser": true,
  5.         "es6": true
  6.     },
  7.     "extends": "google",
  8.     "globals": {
  9.         "Atomics": "readonly",
  10.         "SharedArrayBuffer": "readonly"
  11.     },
  12.     "parserOptions": {
  13.         "ecmaVersion": 2018,
  14.         "sourceType": "module"
  15.     },
  16.     "plugins": [
  17.         "vue"
  18.     ],
  19.     "rules": { // 规则 https://eslint.org/docs/rules/
  20.     }
  21. };
  1. // https://eslint.org/docs/user-guide/configuring
  2. // .eslintrc.js  例子一篇
  3. module.exports = {
  4.   root: true,
  5.   parserOptions: {
  6.     parser: 'babel-eslint'
  7.   },
  8.   env: {
  9.     browser: true,
  10.   },
  11.   extends: [
  12.     // https://github.com/vuejs/eslint-plugin-vue#priority-a-essential-error-prevention
  13.     // consider switching to `plugin:vue/strongly-recommended` or `plugin:vue/recommended` for stricter rules.
  14.     'plugin:vue/essential', 
  15.     // https://github.com/standard/standard/blob/master/docs/RULES-en.md
  16.     'standard'
  17.   ],
  18.   // required to lint *.vue files
  19.   plugins: [
  20.     'vue'
  21.   ],
  22.   // add your custom rules here
  23.   rules: {
  24.     // allow async-await
  25.     'generator-star-spacing': 'off',
  26.     // allow debugger during development
  27.     'no-debugger': process.env.NODE_ENV === 'production' ? 'error' : 'off'
  28.   }
  29. }