How can I remove the semicolon rule?

I've tried to remove the semi rules, but I'm not succeeding. When I save the file once it removes the semicolons and lint plains that it's missing, and when I insert it it plains again saying to remove.

I would like to keep the semicolon

Thats my .prettierrc file:

{
  "printWidth": 100,
  "singleQuote": true,
  "tabWidth": 4,
  "trailingComma": "es5",
  "endOfLine":"auto",
  "semi": true
}

and thats my .eslintrc file

{
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "env": {
        "browser": true, 
        "node": true,
        "es6": true
    },
    "extends": [
        "airbnb",
        "plugin:prettier/remended", 
        "plugin:react/remended",
        "plugin:jsx-a11y/remended"
    ],
    "plugins": ["prettier", "react", "react-hooks"],
    "rules": {
        "prettier/prettier": [
            "error",
            {
              "endOfLine": "auto"
            }
        ],
        "react-hooks/exhaustive-deps": "warn",
        "react-hooks/rules-of-hooks": "error",
        "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
        "react/jsx-indent-props": [2, 4],
        "react/jsx-indent": [2, 4],
        "react/jsx-one-expression-per-line": [0],
        "react/prefer-stateless-function": [1],
        "react/static-property-placement": [1, "property assignment"],
        "react/prop-types": "off"
    }
}

How can I remove the semicolon rule?

I've tried to remove the semi rules, but I'm not succeeding. When I save the file once it removes the semicolons and lint plains that it's missing, and when I insert it it plains again saying to remove.

I would like to keep the semicolon

Thats my .prettierrc file:

{
  "printWidth": 100,
  "singleQuote": true,
  "tabWidth": 4,
  "trailingComma": "es5",
  "endOfLine":"auto",
  "semi": true
}

and thats my .eslintrc file

{
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        }
    },
    "env": {
        "browser": true, 
        "node": true,
        "es6": true
    },
    "extends": [
        "airbnb",
        "plugin:prettier/remended", 
        "plugin:react/remended",
        "plugin:jsx-a11y/remended"
    ],
    "plugins": ["prettier", "react", "react-hooks"],
    "rules": {
        "prettier/prettier": [
            "error",
            {
              "endOfLine": "auto"
            }
        ],
        "react-hooks/exhaustive-deps": "warn",
        "react-hooks/rules-of-hooks": "error",
        "react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx"] }],
        "react/jsx-indent-props": [2, 4],
        "react/jsx-indent": [2, 4],
        "react/jsx-one-expression-per-line": [0],
        "react/prefer-stateless-function": [1],
        "react/static-property-placement": [1, "property assignment"],
        "react/prop-types": "off"
    }
}

• javascript
• eslint
• prettier
• eslint-config-airbnb

• See eslint/docs/2.0.0/rules/semi#options for the correct way to configure the semi rule. – Barmar Commented Apr 26, 2022 at 19:45

3 Answers 3

Within the rules section, override prettier configuration like so:

  "rules": {
    "prettier/prettier": ["error", { "semi": false }],
  }

This will disallow the use of a semicolon where it's not required, as per the prettier rules.

I got rid of the same error by setting the prettier rules configuration in .eslintrc to:

"rules": {
        "prettier/prettier": [
            "error",
            {
              "endOfLine": "off"
            }
        ],

while keeping in .prettierrc:

"endOfLine": "auto"

NOTE: This is just an intent to workaround the error you (and I) got, but the effect I see is that the "endOfLine" rule will work when using the pretty formatted but not when running eslint.

Just remove from the .eslintrc in the rules section the line:

"prettier/prettier": "error"

It seems like it causes some conflict.

If you use the solution: https://stackoverflow./a/72880773/6889886 proposed by silver_mx, the VS Code will not inform you about the issue while writing the code.