linter-eslint seems not working inside the editor with react-scripts 5 *

[emrea-works]

History was smooth and sweet: Everything has been working as expected, during the development with react-script 4 my setup was:

• Atom 1.58
• linter, linter-eslint, linter-ui-default atom packages are installed
• eslintConfig settings only in package.json file instead of an .eslintrc file.
• Prettier was installed and working along linter-eslint without any conflict, even linting together at the same time

Now the issue:

• Atom 1.60, linter, linter-eslint, linter-ui-default are updated
• eslintConfig section in package.json is exaclty the same like I used before with react-script 4
  • "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] }
• Prettier is installed and linting well.

Here's the proof that yarn create react-app my-react-app command installed eslint plugin as default, which is required as by linter-eslint plugin to function well:

$ yarn list --depth 0 | grep "eslint" --color
├─ @babel/eslint-parser@7.17.0
├─ @eslint/eslintrc@1.2.0
├─ @rushstack/eslint-patch@1.1.0
├─ @types/eslint-scope@3.7.3
├─ @types/eslint@7.29.0
├─ @typescript-eslint/eslint-plugin@5.13.0
├─ @typescript-eslint/experimental-utils@5.13.0
├─ @typescript-eslint/parser@5.13.0
├─ @typescript-eslint/scope-manager@5.13.0
├─ @typescript-eslint/type-utils@5.13.0
├─ @typescript-eslint/types@5.13.0
├─ @typescript-eslint/typescript-estree@5.13.0
├─ @typescript-eslint/utils@5.13.0
├─ @typescript-eslint/visitor-keys@5.13.0
├─ eslint-config-react-app@7.0.0
├─ eslint-import-resolver-node@0.3.6
├─ eslint-module-utils@2.7.3
├─ eslint-plugin-flowtype@8.0.3
├─ eslint-plugin-import@2.25.4
├─ eslint-plugin-jest@25.7.0
├─ eslint-plugin-jsx-a11y@6.5.1
├─ eslint-plugin-react-hooks@4.3.0
├─ eslint-plugin-react@7.29.3
├─ eslint-plugin-testing-library@5.0.6
├─ eslint-scope@5.1.1
├─ eslint-utils@3.0.0
├─ eslint-visitor-keys@3.3.0
├─ eslint-webpack-plugin@3.1.1
├─ eslint@8.10.0

package.json

{
  "name": "my-new-react-application",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.14.1",
    "@testing-library/react": "^12.0.0",
    "@testing-library/user-event": "^13.2.1",
    "big.js": "^6.1.1",
    "dot-env": "^0.0.1",
    "node-sass": "^7.0.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^6.2.2",
    "react-scripts": "5.0.0",
    "react-slick": "^0.28.1",
    "sass": "^1.49.9",
    "uikit": "^3.11.1",
    "uikit-react": "^3.1.3",
    "web-vitals": "^2.1.0"
  },
  "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": {}
}

An output as a clue maybe: When I run prettier inside the editor, Prettier lints and outputs in linter-ui-default panel very well, but I need to see the warnings and errors in linter panel during the coding process.

I assume that I have followed all suggestions in eslint.org and prettier.io or other stackoverflow conversations for the right configuration, however, Atom's linter-eslint doesn't expect deep, specific configuration from the user as long as user has "eslintConfig" in package.json file as default.

What would you suggest?

Thanks in advance.

(*) moved this topic from atom discussions in here.