react项目因eslint检测未通过而Failed to compile编译失败
环境
- node v16.20.2
- react 18.3.1
- react-scripts 4.0.3
.eslintrc.json 配置：
{"env": {"browser": true,"es6": true,"node": true},"settings": {"react": {"pragma": "React","version": "detect"}},"plugins": ["react", "react-hooks", "@typescript-eslint"],"extends": ["eslint:recommended", "plugin:react/recommended", "plugin:@typescript-eslint/recommended"],"parser": "@typescript-eslint/parser","rules": {"no-caller": 2,"no-undef": 2,"no-unused-vars": 2,"no-use-before-define": 0,"object-curly-spacing": ["error", "always"],"strict": 0,"semi": 2,"no-loop-func": 0,"no-multi-spaces": "error","keyword-spacing": ["error",{"before": true,"after": true}],"quotes": ["error","single",{"allowTemplateLiterals": true}],"indent": ["error",2,{"SwitchCase": 1}],"no-console": ["error"],"camelcase": ["error",{"properties": "always","ignoreDestructuring": false}],"@typescript-eslint/explicit-module-boundary-types": "off","react-hooks/rules-of-hooks": "error","react-hooks/exhaustive-deps": "error"},"ignorePatterns": ["dist/**/*"],"overrides": [{"files": ["tests/**/*"],"env": {"jest": true}}]
}
报错信息
Failed to compile.src/TreeView.jsxLine 181:10: 'test' is assigned a value but never used no-unused-varsLine 181:16: 'setTest' is assigned a value but never used no-unused-varsSearch for the keywords to learn more about each error.
开发过程中，因为eslint问题，无法很好debug调试程序，影响效率。
解决方式
开发过程仅提示即可，避免eslint造成的编译失败；只需保证build构建环节eslint问题报错即可。
在本地开发环境 .env.development 文件中配置 ESLINT_NO_DEV_ERRORS=true
配置完后，出现的就是 eslint 相关 warnings.
Compiled with warnings.src/TreeView.jsxLine 181:10: 'test' is assigned a value but never used @typescript-eslint/no-unused-varsLine 181:16: 'setTest' is assigned a value but never used @typescript-eslint/no-unused-varssrc/TreeView.jsxLine 181:10: 'test' is assigned a value but never used no-unused-varsLine 181:16: 'setTest' is assigned a value but never used no-unused-varsSearch for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.
参考：https://create-react-app.dev/docs/advanced-configuration/