在react项目中使用ESlint

eslint按指定的规则去检查我们的代码（也可以一定的程度修正代码）

 

最好的时间点是创建项目时使用

vue-cli集成了eslint的配置，可以让我们自己选择

cra没有集成eslint，需要我们自己配置

那如何配置呢？

1.在项目中安装eslint以及对应的规则包

npm i eslint

2.配置eslint的配置文件（可选的）。执行eslint的命令

npx eslint --init

        1、提供交互界面，用户去选择

        2、根据选择去自动下包

        3、自动生成配置文件

 

3.配置开发工具【vscode】能ctrl+s自动修复格式错误

        1、在vscode中安装eslint插件

        2、在vscode设置，让eslint插件显示在菜单栏上

"eslint.alwaysShowStatus": true

        3、配置 设置工作区设置 --> 自动创建.vscode/settings.json文件，内容如下(不要配置用户级别的配置！)：

{
    "eslint.run": "onType",
    "eslint.options": {
      "extensions": [".js", ".vue", ".jsx", ".tsx"]
    },
    "editor.codeActionsOnSave": {
      "source.fixAll.eslint": true
    }
}

        4、检查效果。

                ctrl+s格式化了