CRA 5.xx - HMR/Fast-Refresh for any .js or .jsx does not trigger component refresh when eslint is enabled

[plugpulled]

When i do some changes in .js,.jsx files it is triggering the HMR saying "Compiling..." but there are no changes reflected in the screen until i refresh. But the eslint error overlay is showing the new lint errors, pretty errors i have made yet no changes to the components.

These are my eslint rules.

module.exports = {
  env: {
    browser: true,
    es6: true,
    node: true, //remove module not found errors
    jest: true, //remove jest no-undef errors
  },
  parser: "@babel/eslint-parser",
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 2018,
    sourceType: "module",
    requireConfigFile: false,
    babelOptions: {
      //required or else flow errors eg:- src/index.js @ ReactDOM.render
      presets: ["@babel/preset-react"],
    },
  },
  extends: [
    "eslint:recommended",
    "plugin:react/recommended",
    "plugin:react-hooks/recommended",
    "plugin:prettier/recommended",
  ],
  globals: {
    Atomics: "readonly",
    SharedArrayBuffer: "readonly",
  },
  plugins: ["react", "react-hooks"],
  rules: {
    "no-unused-vars": [
      "error",
      {
        destructuredArrayIgnorePattern: "^_",
        ignoreRestSiblings: true,
      },
    ],
    "no-duplicate-imports": "error",
    "react/display-name": "off",
    "react/prop-types": "off",
    "react/react-in-jsx-scope": "off",
    //"react-hooks/exhaustive-deps": "warn", // change while developing so that the editor or linter can catch useEffect, useMemo, useCallback dependency array issues
    "react-hooks/exhaustive-deps": "off",
    "prettier/prettier": [
      "error",
      {
        endOfLine: "auto",
      },
    ],
  },
};

Environment

Node v16.16.0
npm v8.xx
eslint-plugin-react v7.31.8
eslint-config-prettier v8.5.0
eslint-plugin-prettier v4.0.0

Expected behavior

When making changes to .js,.jsx the HMR or React fast refresh needs to reload the component without requiring a page refresh with eslint enabled.