I wanted to use eslint to integrate the airbnb styleguide. Also I want the prettier style rules.

Problem is eslint is giving me no errors when using it from the command line but VSCode does. VSCode shows in the Problems Tab "eslint(prettier/prettier)" as error. When i run eslint src/** i get zero errors.

Also pressing save in VSCode Formats my Code using prettier ( Plugin ) but most of the time it just changes back to the old formatting then.

So i want when i execute eslint src/** to apply prettier rules like my VSCode does.

My .eslintrc.json

{
  "extends": [
    "airbnb",
    "airbnb/hooks",
    "airbnb-typescript",
    "prettier"
  ],
  "plugins": [
    "prettier",
    "@typescript-eslint"
  ],
  "env": {
    "browser": true,
    "es6": true,
    "jest": true
  },
  "ignorePatterns": [
    "*.css",
    "*.png",
    "*.json",
    "*.svg"
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "sourceType": "module",
    "project": "./tsconfig.json"
  },
  "rules": {
    "react/jsx-filename-extension": [
      1,
      {
        "extensions": [
          ".tsx"
        ]
      }
    ],
    "import/extensions": [
      "error",
      "never",
      {
        "json": "always",
        "svg": "always",
        "css": "always"
      }
    ],
    "max-len": [
      "error",
      {
        "code": 999,
        "ignoreStrings": true,
        "ignoreComments": true,
        "ignoreTemplateLiterals": true
      }
    ],
    "func-names": [
      "error",
      "as-needed",
      {
        "generators": "never"
      }
    ],
    "react/jsx-props-no-spreading": [
      "off"
    ],
    "no-param-reassign": [ 
      "error", 
      { "props": false } 
    ],
    "import/order": [
      "error",
      {
        "groups": [
          "index",
          "sibling",
          "parent",
          "internal",
          "external",
          "builtin",
          "object",
          "type"
        ],
        "alphabetize": {
          "order": "asc",
          "caseInsensitive": true
        }
      }
    ],
    "react/function-component-definition": [
      2,
      {
        "namedComponents": "function-declaration"
      }
    ],
    "no-tabs": ["error", { "allowIndentationTabs": false }],
    "prettier/prettier": "error"
  }
}

.prettierrc

{
    "printWidth": 999,
    "singleQuote": true,
    "useTabs": false
}