Why do I keep getting Delete 'cr' [prettier/prettier]?

Question

I am using vscode with Prettier 1.7.2 and Eslint 1.7.0. After every newline I get:

[eslint] Delete 'cr' [prettier/prettier]

This is the .eslintrc.json:

{
  "extends": ["airbnb", "plugin:prettier/recommended"],
  "env": {
    "jest": true,
    "browser": true
  },
  "rules": {
    "import/no-extraneous-dependencies": "off",
    "import/prefer-default-export": "off",
    "no-confusing-arrow": "off",
    "linebreak-style": "off",
    "arrow-parens": ["error", "as-needed"],
    "comma-dangle": [
      "error",
      {
        "arrays": "always-multiline",
        "objects": "always-multiline",
        "imports": "always-multiline",
        "exports": "always-multiline",
        "functions": "ignore"
      }
    ],
    "no-plusplus": "off"
  },
  "parser": "babel-eslint",
  "plugins": ["react"],
  "globals": {
    "browser": true,
    "$": true,
    "before": true,
    "document": true
  }
}

The .prettierrc file:

{
  "printWidth": 80,
  "tabWidth": 2,
  "semi": true,
  "singleQuote": true,
  "trailingComma": "es5",
  "bracketSpacing": true,
  "jsxBracketSameLine": false,
}

How can I get rid of this error?

Answer 1

Try setting the "endOfLine":"auto" in your .prettierrc file (inside the object)

Or set

'prettier/prettier': [
  'error',
  {
    'endOfLine': 'auto',
  }
]

inside the rules object of the eslintrc file.

If you are using windows machine endOfLine can be "crlf" basing on your git config.

Answer 2

change this setting on VSCode.

Answer 3

In my windows machine, I solved this by adding the below code snippet in rules object of .eslintrc.js file present in my current project's directory.

    "prettier/prettier": [
      "error",
      {
        "endOfLine": "auto"
      },
    ],

This worked on my Mac as well

Answer 4

in the file .eslintrc.json in side roles add this code it will solve this issue

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

  }

Answer 5

I know this is old but I just encountered the issue in my team (some mac, some linux, some windows , all vscode).

solution was to set the line ending in vscode's settings:

.vscode/settings.json

{
    "files.eol": "\n",
}

https://qvault.io/2020/06/18/how-to-get-consistent-line-breaks-in-vs-code-lf-vs-crlf/

Answer 6

Fixed - My .eslintrc.js looks like this:

module.exports = {
  root: true,
  extends: '@react-native-community',
  rules: {'prettier/prettier': ['error', {endOfLine: 'auto'}]},
};

Answer 7

Solution

git config --global core.autocrlf false

After global configuration, you need to pull the code again.

Root cause of the problem:

The culprit is git, a configuration property of core.autocrlf

For historical reasons, the line breaks of the text file on windows and linux are different.

• Windows At the time of line break, carriage return is used at the same time CR(carriage-return character) and line breaks LF(linefeed character)
• Mac and Linux only use the newline character LF
• Old version of Mac uses carriage return CR

Therefore, there will be incompatibility problems when text files are created and used in different systems.

When I clone code on Windows, autocrlf is true as default and then each line of the file is automatically converted to CRLF. If you do not make any changes to the file, eslint delete CR by pre-commit since git automatically convert CRLF to LF.

Reference

https://developpaper.com/solution-to-delete-%E2%90%8Deslint-prettier-prettier-error/

Answer 8

Try this. It works for me:

yarn run lint --fix

or

npm run lint -- --fix

Answer 9

Fixed: My eslintrc.js some rule look like this:

rules: {
    'prettier/prettier': ['error', { "endOfLine": "auto"}, { usePrettierrc: true }],  // Use our .prettierrc file as source
    'react/react-in-jsx-scope': 'off',
    'react/prop-types': 'off',
    'simple-import-sort/imports': 'error',
    "simple-import-sort/exports": "error"
}

Answer 10

I am using git+vscode+windows+vue, and after read the eslint document: https://eslint.org/docs/rules/linebreak-style

Finally fix it by:

add *.js text eol=lf to .gitattributes

then run vue-cli-service lint --fix

Answer 11

Add this to your .prettierrc file and open the VSCODE

"endOfLine": "auto"

Answer 12

If the above code is not working for you try these two steps.

1. in the file .eslintrc.json inside roles object add this code it will solve this issue

 "prettier/prettier": ["error",{
      "endOfLine": "auto"}
    ]

2 Change dev server --fix

npm run dev

To

npm run dev --fix

OR

npm run lint -- --fix
yarn run lint -- --fix

Answer 13

Check the right-hand side of VS Code's status bar at the bottom where it shows information such as line and column, spaces, text encoding (UTF-8 etc). You should see a Select End Of Line Sequence status display (either LF or CRLF) that you can click on to change. Make sure you haven't manually changed this to something that conflicts with what you wish Prettier to use.

Answer 14

I upgraded to "prettier": "^2.2.0" and error went away

Answer 15

In my case I am using windows OS and git code supports in Mac and getting converted to CRLF run below Command in cmd prompt to stop files getting converted to CRLF:

git config --global core.autocrlf input

Checkout the code again and open Visual Studio Code again and run your scripts again. It worked for me.

Answer 16

I tried everything here and for me, I needed to manage prettier config extension through icon extensions > prettier > small engine > extensions settings > Prettier: End Of Line > set to auto.

After adding these two lines in my settings.json

"eslint.run": "onSave",
"editor.formatOnSave": true,

I was able to use the config below inside .eslintrc.js rule.

"prettier/prettier": ["error", {
    "endOfLine":"auto"
}],

Answer 17

In the root open the .editorconfig file and change:

end_of_line = lf

to

end_of_line = auto

This should fix it for new files.

Answer 18

There is no need to ignore linter's rule. Just auto-fix it

npm install -g prettier
prettier -w .\webpack.config.js # or other file

Answer 19

I was having the same problem in my nest js app . Adding the below code to .eslintrc.jsrules and then running yarn run lint --fix fixed the issue .

'prettier/prettier': [
  'error',
  {
    endOfLine: 'auto',
  },
],

and my .eslintrc.js rules looks something like this..

 rules: {
'@typescript-eslint/interface-name-prefix': 'off',
'@typescript-eslint/explicit-function-return-type': 'off',
'@typescript-eslint/explicit-module-boundary-types': 'off',
'@typescript-eslint/no-explicit-any': 'off',
'prettier/prettier': [
  'error',
  {
    endOfLine: 'auto',
  },
],

},

Answer 20

All the answers above are correct, but when I use windows and disable the Prettier ESLint extension rvest.vs-code-prettier-eslint the issue will be fixed.

Answer 21

What worked for me was:

1. Update prettier to version 2.2.1 (latest version at the moment) as Roberto LL suggested. To do it execute

npm update prettier

2. Execute lint fix as Hakan suggested (This will modify all files in the project to convert line ending to LF).

npm run lint -- --fix

It was not necessary to change .eslintrc and .prettierrc files!

Answer 22

Change file type from tsx -> ts, jsx -> js

You can get this error if you are working on .tsx or .jsx file and you are just exporting styles etc and not jsx. In this case the error is solved by changing the file type to .ts or .js