目录
先初始化项目、安装依赖
先写问题代码
执行eslint进行代码检测
完成eslint配置
执行eslint检查
思考
定义一个项目然后执行yarn init --yes初始化一个package.json
yarn add eslint--dev安装eslint
在根目录下创建一个01parse.js的文件，代码如下：
const foo = 123
const fn = () => {
console.log('hello eslint')
console.log("未调用foo")
}
fn(
syy()
yarn eslint xx.js 执行代码检查，如果是第一次检查则会提示没有找到eslint的配置文件，建议我们使用eslint init进行初始化一个配置文件。
报错信息如下：
Oops! Something went wrong! :(
ESLint: 7.3.1
ESLint couldn't find a configuration file. To set up a configuration file for this project, please run:
eslint --init
ESLint looked for configuration files in D:\study\webStudy\eslint and its ancestors. If it found none, it then looked in your home directory.
If you think you already have a configuration file or if you need more help, please stop by the ESLint chat room: https://eslint.org/chat
执行yarn eslint --init
会询问我们一些问题翻译后如下：
（1）我们如何使用eslint，有以下3个选项
只检查语法错误检查语法错误、发现问题代码检查语法错误如括号错误之类的、发现问题代码如调用了不存在的函数、检查代码风格问题如缩进建议选择第三个选项
（2）what type of modules does your project use?模块化使用的是哪种方式
JavaScript modules (import/export) 使用的是ES ModulesCommonJS (require/exports):使用的是commonJSNone of these:没有使用我们根据实际情况选择即可
（3）Which framework does your project use? 你用的哪种框架？
ReactVue.jsNone of these根据实际情况选择即可
（4） Does your project use TypeScript? » No / Yes 项目中用到了ts吗？
（5）?Where does your code run? 运行环境是那种？
Browser 浏览器Node(6) How would you like to define a style for your project?你将使用何种规范？
Use a popular style guide 使用主流规范Answer questions about your style 询问一些问题Inspect your JavaScript file(s) 根据js文件来定(7) Which style guide do you want to follow?你要遵循哪种风格指南？
Airbnb: https://github.com/airbnb/javascriptStandard: https://github.com/standard/standardGoogle: https://github.com/google/eslint-config-google（8）What format do you want your config file to be in?你想要配置文件的格式是什么？也就是eslint的配置文件是以js结尾还是以json结尾
JavaScriptYAMLJSON常用的是js和json文件。
然后会提示你Checking peerDependencies of eslint-config-standard@latest，比较慢需要等一会
（9）Would you like to install them now with npm? · No / Yes
选yes,然后会进行安装eslint相关依赖
等待安装完成，可以看到目录下多了一个.eslintrc的文件，此文件的扩展名取决你问题8的选择。
先提示语法错误如下：
8:1 error Parsing error: Unexpected token
当我们将代码中的缺失括号补全之后，再次执行yarn eslint 01parse.js会提示很多问题如下：
D:\study\webStudy\eslint\01parse.js
1:7 error 'foo' is assigned a value but never used no-unused-vars
3:1 error Expected indentation of 2 spaces but found 4 indent
4:1 error Expected indentation of 2 spaces but found 4 indent
4:17 error Strings must use singlequote quotes
7:1 error 'syy' is not defined no-undef
✖ 5 problems (5 errors, 0 warnings)
3 errors and 0 warnings potentially fixable with the `--fix` option.
error Command failed with exit code 1.
此时已经检查了我们代码中的问题代码problems 。
我们按照提示修复后再次执行yarn eslint 01parse.js会提示我们很多代码风格错误，如最后一行之后要保留一个空行，如果我们的空行过多或没有空行都会进行错误提示
（1）那么多问题有没有办法自动修正？
有的有的，我们在执行检查的时候加上--fix可以自动修改部分问题
（2） 为什么错误不是一起出现？而是先语法错误，再提示了问题代码，最后是风格？
当我们的代码中存在语法错误的时候，是没有办法检查问题代码和代码风格的。所以我们可以理解为他们的执行顺序是先保证语法没有问题后，会进行问题代码的检查，最后进行代码风格的检查。
