react-eslint配置

最新推荐文章于 2025-03-06 14:47:26 发布

原创最新推荐文章于 2025-03-06 14:47:26 发布 · 774 阅读

2 ·

CC 4.0 BY-SA版权

文章标签：

#VS code中添加eslint修复代码

react 同时被 2 个专栏收录

10 篇文章

订阅专栏

VS code使用

4 篇文章

订阅专栏

本文介绍如何在VSCode中配置ESLint进行代码检查及自动修复，包括安装必要的插件、设置配置文件等步骤，确保JavaScript和React项目的代码质量。

react-eslint在vscode中如何配置

首先全局安装eslint：https://cn.eslint.org/docs/user-guide/getting-started

然后当我们装完eslint之后记得在create-react-app脚手架中也需要加载，具体还是看官网

接下来我们开始配置vscode中的eslint：

1、安装eslint插件：

1553668265323

2、安装prettier插件：

1553668297462

3、开始配置设置

在这里插入图片描述

在seethings.json加上这段代码，然后再重启VS code就可以了，当我们Ctrl+s保存的时候，会自动修复代码

"eslint.validate": [
        "javascript",
        "javascriptreact",
        {
            "language": "html",
            "autoFix": true
        },
        {
            "language": "react",
            "autoFix": true
        }
    ],
    // jsx自动修复有问题，取消js的format
    "editor.formatOnSave": false,
    // Enable/disable default JavaScript formatter (For Prettier)
    "javascript.format.enable": false,
    "prettier.singleQuote": true,
    // 点击保存时，根据 eslint 规则自定修复，同时集成 prettier 到 eslint 中
    "prettier.eslintIntegration": true,
    "eslint.autoFixOnSave": true,