ESLINT: ESLINT Error: ESLint configuration in ..\..\..\..\.eslintrc is invalid: - Unexpected top-level property "import/extensions"

im using airbnb-eslint along with babel-plugin-module-resolver. I get this error in every js file where i've used an alias to import.

 {
  "extends": ["plugin:import/errors", "plugin:import/warnings", "airbnb", "airbnb/hooks", "prettier", "plugin:prettier/recommended", "prettier/react", "plugin:react/recommended"],
  "plugins": ["import", "react", "jsx-a11y", "react-hooks", "babel", "module-resolver"],
  "rules": {
    "react/jsx-filename-extension": [
      2,
      {
        "extensions": [".js", ".jsx"]
      }
    ],
    "react/prop-types": 0,
    "implicit-arrow-linebreak": 0,
    "prefer-destructuring": 1,
    "react/no-unused-state": 1,
    "react/destructuring-assignment": 1,
    "react/no-array-index-key": 1,
    "react/jsx-key": [2],
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "warn",
    "react/jsx-no-duplicate-props": [2],
    "react/jsx-uses-vars": [2],
    "react/jsx-uses-react": [2],
    "react/jsx-no-undef": ["error", { "allowGlobals": true}],
    "react/no-direct-mutation-state": [2],
    "react/require-optimization": [1],
    "react/require-render-return": [2],
    "jsx-a11y/img-has-alt": [0],
    "jsx-a11y/img-redundant-alt": [2],
    "no-nested-ternary": "off",
    "no-plusplus": ["error", { "allowForLoopAfterthoughts": true }],
    "no-underscore-dangle": ["error", { "allowAfterThis": true }],
    "no-unused-expressions": ["error", {
      "allowShortCircuit": true,
      "allowTernary": true,
      "allowTaggedTemplates": true
      }],
    "no-use-before-define": [
      "error",
      { "functions": true, "classes": true, "variables": false }
    ],
    "import/imports-first": ["error", "absolute-first"],
    "import/no-unresolved": 0,
    "import/newline-after-import": "error",
    "import/prefer-default-export": 0,
    "import/no-cycle": [2, { "maxDepth": 1, "ignoreExternal": true }],
    "import/no-absolute-path": [2, { "esmodule": false, "commonjs": false, "amd": false }],
    "prettier/prettier": ["error", {}, {
      "usePrettierrc": true
    }],
    "quotes": [
      "error",
      "single",
      { "avoidEscape": true, "allowTemplateLiterals": false }
    ],
    "max-len": ["error", {"code": 205, "ignoreUrls": true}],
    "no-tabs": ["error", {"allowIndentationTabs": true}],
    "babel/arrow-parens": [0, "as-needed"],
    "babel/no-unused-expressions": 1,
    "babel/valid-typeof": 1,
    "module-resolver/use-alias": 2
  },
  "globals": {
    "window": true,
    "document": true,
    "localStorage": true,
    "FormData": true,
    "FileReader": true,
    "Blob": true,
    "navigator": true
  },
  "env": {
    "es2020": true,
    "node": true,
    "browser": true
  },
  "settings": {
    "react": {
      "version": "16.13.1"
    },
    "import/resolver": {
      "babel-module": {
        "root": ["."],
        "alias": {
          "@assets": "./src/assets",
          "@config": "./src/config",
          "@constants": "./src/constants",
          "@hooks": "./src/hooks",
          "@sharedComponents": "./src/sharedComponents",
          "@commonActions": "./src/app/CommonActions",
          "@pages":"./src/app/Pages",
          "@utils": "./src/utils"
        }
      },
      "node": {
        "root": ["."],
        "extensions": [
          ".js",
          ".jsx"
        ]
      }
    }
  },
  "parser": "babel-eslint",
  "parserOptions": {
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true,
      "modules": true
    }
  }
}

This error does not come when using on mac..... only when using Linux/Windows. Due to this error eslint stops working in VSCode.

Error: ESLINT Error: ESLint configuration in .........eslintrc is invalid: - Unexpected top-level property "import/extensions".

Try adding root: true, as this will stop eslint looking for Global configs outside of your project