0

I am making a simple NEXTJS application to study.

I am trying to make a configuration of Prettier and ESLint.

However, while the format on save is working according to the rules I set up, Prettier still shows these errors that are impossible to fix.

Image showing Prettier Error

It asks me to delete space, but a. this is not according to the format and b. even If I do delete de space, the error continues to show up.

This is happening through the entire file.

Details of the configuration:

Versions:

  • "next": "9.4.4"
  • "react": "16.13.1"
  • "react-dom": "16.13.1"
  • "eslint": "^7.3.1"
  • "eslint-config-prettier": "^6.11.0"
  • "eslint-plugin-prettier": "^3.1.4"
  • "prettier": "^2.0.5"

The .eslintrc file

{
  "env": {
    "browser": true,
    "es2020": true
  },
  "settings": {
    "react": {
      "version": "detect"
    }
  },
  "extends": [
    "eslint:recommended",
    "plugin:react/recommended",
    "plugin:@typescript-eslint/eslint-recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:prettier/recommended"
  ],
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    },
    "ecmaVersion": 11,
    "sourceType": "module"
  },
  "plugins": ["react", "react-hooks", "@typescript-eslint"],
  "rules": {
    "react-hooks/rules-of-hooks": "error",
    "react-hooks/exhaustive-deps": "warn",
    "react/prop-types": "off",
    "react/react-in-jsx-scope": "off",
    "@typescript-eslint/explicit-module-boundary-types": "off"
  }
}

The prettierrc file

{
  "trailingComma": "none",
  "semi": false,
  "singleQuote": true
}

The only VSCode extension that I have is the ESLint one. VSCode version is 1.74.3

I uninstalled the Prettier VS Code Plugin. I also tried to change to a newer Prettier version. I tried to unable prettier in .eslintrc file, and while that worked and I got rid of the errors, it isn't the result I wanted (it is not formatting anymore). I also tried to change de .prettierrc file in a number of ways, even deleting it, but the result was the same. I then try to follow this tutorial, but the result was that I ended up with no formatting at all.

0 Answers0