【React】vite + react 项目，进行配置 eslint_vite react eslint

'react'

],
‘rules’: {
},
};

#### 3 安装 vite-plugin-eslint

npm i -D vite-plugin-eslint

#### 4 配置 vite.config.js 文件

import { defineConfig } from ‘vite’
import react from ‘@vitejs/plugin-react’
import eslintPlugin from ‘vite-plugin-eslint’

export default defineConfig({
plugins: [
react(),
// 添加 eslint 插件配置
eslintPlugin({
include: [‘src/**/*.js’, ‘src/**/*.jsx’, ‘src/*.js’, ‘src/*.jsx’]
})
],
resolve: {
alias: {
},
},
})

#### 5 修改 eslint 默认配置


可根据实际情况进行配置。

module.exports = {
‘env’: {
‘browser’: true,
‘es2021’: true
},
‘extends’: [
‘eslint:recommended’,
‘plugin:react/recommended’
],
‘overrides’: [
{
‘env’: {
‘node’: true
},
‘files’: [
‘.eslintrc.{js,cjs}’
],
‘parserOptions’: {
‘sourceType’: ‘script’
}
}
],
‘parserOptions’: {
‘ecmaVersion’: ‘latest’,
‘sourceType’: ‘module’
},
‘plugins’: [
‘react’
],
‘rules’: {
‘indent’: [
2,
2,
{
‘SwitchCase’: 1,
‘ignoredNodes’: [‘TemplateLiteral’]
}
], //缩进
‘no-unused-vars’: [0], //未使用变量
‘quotes’: [2, ‘single’], //单引号
‘jsx-quotes’: [‘error’, ‘prefer-single’],
‘no-console’: [0, { ‘allow’: [‘warn’, ‘error’] }], //console
‘linebreak-style’: [0, ‘unix’], //强制执行统一的行结尾
‘semi’: [2, ‘always’], //分号结尾
‘curly’: 2,
‘no-eval’: 1, //禁止使用eval
‘no-caller’: 2,
‘no-else-return’: 2, //如果if语句里面有return,后面不能跟else语句
‘no-extend-native’: 2, //禁止扩展native对象
‘no-extra-bind’: 2, //禁止不必要的函数绑定
‘no-floating-decimal’: 2, //禁止省略浮点数中的0
‘no-implied-eval’: 2, //禁止使用隐式eval
‘no-labels’: 2, //禁止标签声明
‘no-with’: 2, //禁用with
‘no-loop-func’: 0, //禁止在循环中使用函数（如果没有引用外部变量不形成闭包就可以）
‘no-native-reassign’: 2, //不能重写native对象
‘no-redeclare’: [2], //禁止重复声明变量
‘no-unused-expressions’: 0, //禁止无用的表达式
‘no-unneeded-ternary’: 2, //禁止不必要的嵌套
‘no-use-before-define’: 0, //未定义前不能使用
‘no-unreachable’: 2, //不能有无法执行的代码
‘no-trailing-spaces’: 1, //一行结束后面不要有空格
‘no-dupe-keys’: 2, //在创建对象字面量时不允许键重复 {a:1,a:1}
‘no-dupe-args’: 2, //函数参数不能重复
‘no-duplicate-case’: 2, //switch中的case标签不能重复
‘array-bracket-spacing’: [2, ‘never’], //是否允许非空数组里面有多余的空格
‘arrow-body-style’: [1],
‘no-undef-init’: 0,
‘no-undefined’: 0,
‘key-spacing’: [
//对象字面量中冒号的前后空格
2,
{
‘beforeColon’: false,
‘afterColon’: true
}
],
‘no-lonely-if’: 2, //禁止else语句内只有if语句
‘no-inner-declarations’: [2, ‘functions’], //禁止在块语句中使用声明（变量或函数）
‘no-spaced-func’: 2, //函数调用时 函数名与()之间不能有空格
‘no-case-declarations’: [0],
‘no-multiple-empty-lines’: [1, { ‘max’: 2 }], //空行最多不能超过2行
‘space-in-parens’: [2, ‘never’], //小括号里面要不要有空格

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

😕/bbs.csdn.net/topics/618545628)**

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！