1.打开终端，全局下载ESLint。
npm install eslint -g
2. 打开VS Code，下载eslint插件，重新加载以生效。
eslint插件
3. 进入要使用ESLint的项目，打开终端输入eslint --init进行初始化。
你想怎样使用eslint
我选第三个，这样保存的时候可以自动格式化代码
PS F:\resource> ./node_modules/.bin/eslint --init
? How would you like to use ESLint? (Use arrow keys)
To check syntax only //只检查语法
> To check syntax and find problems//检查语法、发现问题
To check syntax, find problems, and enforce code style//检查语法、发现问题并执行代码样式
您的项目使用什么类型的模块?
vue中用的JavaScript modules
PS F:\resource> ./node_modules/.bin/eslint --init
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? (Use arrow keys)
> JavaScript modules (import/export)
CommonJS (require/exports)
None of these
项目中使用的什么框架？
当然是vue
PS F:\resource> ./node_modules/.bin/eslint --init
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? (Use arrow keys)
> React
Vue.js
None of these
你使用TypeScript吗
我不要
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? Vue.js
? Does your project use TypeScript? (y/N)
你的代码运行在什么地方？
这里是多选，我选的浏览器和node
PS F:\resource> ./node_modules/.bin/eslint --init
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? Vue.js
? Where does your code run? (Press <space> to select, <a> to toggle all, <i> to invert selection)
>(*) Browser
( ) Node
您想如何为您的项目定义一个样式?
分别是 1. 使用大厂的 2. 问问题 3. 检查现有的代码自动生成（我选第一个）
PS F:\resource> ./node_modules/.bin/eslint --init
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? Vue.js
? Where does your code run? Browser, Node
? 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)
你想要遵循哪种风格指南?
我选第一个
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? Vue.js
? Does your project use TypeScript? No
? Where does your code run? Browser, Node
? How would you like to define a style for your project? Use a popular style guide
? Which style guide do you want to follow? (Use arrow keys)
> Airbnb: https://github.com/airbnb/javascript
Standard: https://github.com/standard/standard
Google: https://github.com/google/eslint-config-google
您希望配置文件的格式是什么?
第一个
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? Vue.js
? Does your project use TypeScript? No
? Where does your code run? Browser, Node
? How would you like to define a style for your project? Use a popular style guide
? Which style guide do you want to follow? Airbnb: https://github.com/airbnb/javascript
? What format do you want your config file to be in? (Use arrow keys)
> JavaScript
YAML
JSON
你想现在用npm安装它们吗
选y，安装好结OK了
? How would you like to use ESLint? To check syntax, find problems, and enforce code style
? What type of modules does your project use? JavaScript modules (import/export)
? Which framework does your project use? Vue.js
? Does your project use TypeScript? No
? Where does your code run? Browser, Node
? How would you like to define a style for your project? Use a popular style guide
? Which style guide do you want to follow? Airbnb: https://github.com/airbnb/javascript
? What format do you want your config file to be in? JavaScript
Checking peerDependencies of eslint-config-airbnb-base@latest
The config that you've selected requires the following dependencies:
eslint-plugin-vue@latest eslint-config-airbnb-base@latest eslint@^5.16.0 || ^6.1.0 eslint-plugin-import@^2.18.2
? Would you like to install them now with npm? (Y/n)
4.安装完成
完成后应该会有.eslintec.js这么个文件
可以在rules追加或者禁用一些你不喜欢的规则
具体规则可以到eslint中文网瞄一下
http://eslint.cn/docs/rules/
image.png
