eslintrc.json

{
  "parser": "@typescript-eslint/parser",
  "plugins": [
      "react",
      "@typescript-eslint"
  ],
  "extends": [
      "airbnb", // airbnb code-style guidelines (or airbnb-base)
      "import",
      "prettier/@typescript-eslint",
      "plugin:@typescript-eslint/recommended",
      "plugin:prettier/recommended",
      "plugin:import/errors",
      "plugin:import/warnings",
    
      // React Development Only
      "airbnb/hooks",
      "prettier/react",
      "plugin:react/recommended",
      "plugin:jsx-a11y/recommended"
  ],
  "rules": {
      "linebreak-style": 0,
      "import/prefer-default-export": 0,
      "import/extensions": 0,
      "no-use-before-define": 0,
      "import/no-unresolved": 0,
      "no-shadow": 0,
      "import/no-extraneous-dependencies": 0, // Allowing devDependency Option
      "prettier/prettier" : ["error", { "endOfLine": "auto" }], // Prettier Roles
        
      // React Development Only
      "react/prop-types": 0,
      "react/react-in-jsx-scope": 0,
      "jsx-a11y/no-noninteractive-element-interactions": 0,
      "@typescript-eslint/explicit-module-boundary-types": 0,
      "react/jsx-filename-extension": [2, { "extensions": [".js", ".jsx", ".ts", ".tsx"] }]
  },
  "env": { // development environment
      "browser": true,
      "es2021": true
  },
  "settings": {
      "import/resolver": {
          "node": {
              "extensions": [".js", ".jsx", ".ts", ".tsx"] // Allowing JSX/TSX
          }
      }
  },
  "parserOptions": {
      "ecmaFeatures": {
          "jsx": true
      },
      "ecmaVersion": 12,
      "sourceType": "module"
  }
}