Настроил eslint и теперь при какой либо ошибке в eslint'e реакт выдает ошибку, что есть ошибки в eslint, вместо просто выдачи их в консоли при npm start и подсвечивании их в webstorme. Такая же проблема и с typescript, если есть ошибки приложение показывает ее вместо рендера. Я искал решение и нашел только одно путем добавления
failOnError: false,
emitWarning: true,
в webpack, а он находится в node_modules -> reacts-scripts, а чтобы его вывести нужно делать eject чего я делать не хочу.
есть ли какой-то способ это пофиксить?
tsconfig.json
{
"compilerOptions": {
"experimentalDecorators": true,
"target": "es6",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx",
"baseUrl": "src"
},
"include": [
"src"
]
}
.eslintrc
{
"env": {
"browser": true
},
"extends": [
"standard",
"plugin:react/recommended", // Uses the recommended rules from @eslint-plugin-react
"plugin:@typescript-eslint/recommended"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"modules": true,
"experimentalObjectRestSpread": true
}
},
"plugins": [
"babel",
"react",
"react-hooks",
"@typescript-eslint"
],
"overrides": [
{
// enable the rule specifically for TypeScript files
"files": ["*.ts", "*.tsx", "*.js"],
"rules": {
"@typescript-eslint/parser": ["off", {
"failOnError": false,
"emitWarning": true
}]
}
}
],
"rules": {
"semi": [2, "always"],
"react/jsx-indent": [2, 2],
"react/jsx-boolean-value": [2, "always"],
"key-spacing": "off",
"jsx-quotes": [2, "prefer-double"],
"max-len": [2, 140, 2],
"object-curly-spacing": [2, "always"],
"indent": [2, 2, { "SwitchCase": 1 }],
"comma-dangle": "off",
"import/order": [
"error",
{
"groups": ["builtin", "external", "internal", "sibling", "parent"],
"newlines-between": "always",
"pathGroups": [
{
"pattern": "~/**",
"group": "internal"
}
]
}
],
"import/newline-after-import": ["error"],
"import/no-unresolved": "off",
"import/no-extraneous-dependencies": ["error"],
"react-hooks/rules-of-hooks": ["error"],
"react-hooks/exhaustive-deps": ["warn"],
"no-console": "warn",
"no-use-before-define": "off"
}
}
package.json
{
"name": "project1",
"version": "0.1.0",
"private": true,
"dependencies": {
"@material-ui/core": "^4.11.0",
"@material-ui/icons": "^4.9.1",
"@testing-library/jest-dom": "^5.11.5",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"@types/jest": "^26.0.15",
"@types/node": "^12.19.1",
"@types/react": "^16.9.53",
"@types/react-dom": "^16.9.8",
"@types/react-router-dom": "^5.1.6",
"@typescript-eslint/eslint-plugin": "^3.0.0",
"@typescript-eslint/parser": "^3.0.0",
"axios": "^0.21.0",
"babel-eslint": "^10.1.0",
"bootstrap": "^4.5.3",
"eslint-config-standard": "^14.1.1",
"eslint-config-standard-react": "^9.2.0",
"eslint-plugin-babel": "^5.3.0",
"eslint-plugin-import": "^2.19.1",
"eslint-plugin-node": "^9.0.1",
"eslint-plugin-promise": "^4.2.1",
"eslint-plugin-react": "^7.17.0",
"eslint-plugin-react-hooks": "^4.0.2",
"eslint-plugin-standard": "^4.0.1",
"mobx": "^6.0.1",
"mobx-react-lite": "^3.0.1",
"nanoid": "^3.1.16",
"react": "^17.0.1",
"react-bootstrap": "^1.4.0",
"react-dom": "^17.0.1",
"react-perfect-scrollbar": "^1.5.8",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.1",
"react-toastify": "^6.0.9",
"typescript": "^4.1.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"axios-mock-adapter": "^1.18.2",
"eslint": "^7.1.0",
"eslint-webpack-plugin": "^2.4.0",
"node-sass": "^4.14.1"
}
}
Простой
