Why do I keep getting "[eslint] Delete `CR` [prettier/prettier]"?

Question

I am using VS Code 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?

Take a look at your .eslintrc.js file. removing `'plugin:prettier/recommended'` from the extends array should fix the issue. — Sanu Soman, Aug 08 '21 at 05:30

score 1085 · Answer 1 · edited May 15 '23 at 19:50

1085

Try setting the "endOfLine":"auto" in your .prettierrc (or .prettierrc.json) 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.

edited May 15 '23 at 19:50

PerfectM1nd

3
1
1

answered Dec 13 '18 at 19:57

Vah Run

11,223
2
11
15

128

Changing the `.eslintrc` file worked for me, but not the `.prettierrc` file. No idea why or what the difference is (I'm new to all the tags on the OP). – Neo Jan 31 '19 at 02:19
11

My guess is that you might need Prettier extension in the VS Code. The prettierrc will only be valid in that scenario. – Vah Run May 29 '19 at 03:02
14

changing the end of line sequence from `CRLF` to `LF` worked for me, on a windows machine – Anup Jun 18 '20 at 07:33
110

For a newbie like me, this is how it is to be done. Open `.eslintrc.json` present in your root directory (`frontend`). After changes it will look as under: `{ "extends": ["react-app", "prettier"], "plugins": ["prettier"], "rules": { "prettier/prettier": ["error", { "endOfLine": "auto" }] } } ` – SimpleGuy Aug 30 '20 at 01:50
21

FYI: a restart is required for the changes to take effect on VSCode. – Sangimed Aug 18 '21 at 16:40
I created a file .prettierrc.json with "endOfLine":"auto", as that is a valid filename and nothing was working. 2 hours later, I decided to rename the file to .prettierrc to rules things out, but I couldn't. -the file already existed! doh. and that gets picked up first! – steve Apr 28 '22 at 02:57
for me it worked after a window reload with ```ESlint: fix all auto-fixable problem``` command for eslint file – Taimoor Oct 21 '22 at 17:41
In continuation to the comment from @SimpleGuy : after completion of the steps run `npm run lint -- --fix` helps. – Rahul Reddy Jan 05 '23 at 15:40
The key as @Sangimed mentioned is to restart VS Code if you place any Prettier rules in the prettierrc file. If the rule are placed in the Eslint file, a restart shouldn't be needed. – Brandon Jun 18 '23 at 21:46

score 684 · Answer 2 · edited Jul 03 '23 at 18:13

684

Change this setting on VSCode.

edited Jul 03 '23 at 18:13

Slate

221
5
14

answered Jan 16 '19 at 03:19

xudong zhang

6,899
1
5
2

37

This would fix the problem, but only till you opened some other source file with CRLF. Above answer is more effective. – BobHy Jun 07 '19 at 17:55
4

Besides changing `CRLF` to `LF` within VSCode, `git` might be doing auto conversion under the hood. If you chose `checkout Windows-style` when installing, it converts source code you clone to `CRLF`. So reinstalling `git` and choose `checkout as-is, commit Unix-style` will fix it. – Huy Apr 08 '21 at 10:22

score 237 · Answer 3 · edited Feb 01 '21 at 02:15

237

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

edited Feb 01 '21 at 02:15

Brent Woodle

153
4

answered Aug 30 '20 at 06:21

Jake

2,493
1
7
19

score 76 · Answer 4 · answered Apr 28 '21 at 18:24

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/

This solution would break cross-platform development - you'd be able to push a mix or LF/CR/CRLF to the repo. I suggest not to use it unless you work alone, and only ever on one type of OS (Linux/Mac/Windows). A good config for a team is to use autocrlf=true and just configure the linting tools to respect the EOL characters of the platform they run on, as in the other answers ("endOfLine": "auto"). What is worse is that you suggest to set autocrlf=false GLOBALLY, I think if it ever needs to be done, it should always be per-repo, otherwise all your new repos have a problem from the get go. — Jakub Januszkiewicz, Jun 02 '22 at 08:12

score 65 · Answer 5 · answered Nov 28 '20 at 08:28

65

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

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

  }

answered Nov 28 '20 at 08:28

Mohammed Al-Reai

2,344
14
18

This is what I was looking for - ppl didn't mention that it must be inside "rules" otherwise it won't help at all – Rezor Dec 21 '22 at 13:19

score 45 · Answer 6 · edited Nov 05 '21 at 21:06

45

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

1. in the file .eslintrc.json inside rules 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

edited Nov 05 '21 at 21:06

naspinski

34,020
36
111
167

answered May 22 '21 at 09:52

Hadayat Niazi

1,991
3
16
28

score 34 · Answer 7 · edited Jun 30 '23 at 13:48

34

As you can see add this into .eslintrc works!

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

edited Jun 30 '23 at 13:48

Z-100

518
3
19

answered Apr 02 '22 at 07:46

Frank Guo

547
7
8

17

Would be an even better answer if you pasted searchable and copy/pasteable source code, rather than an image :-) – Christoph Sep 09 '22 at 03:08
This is the code, it worked for me "prettier/prettier": [ "error", { "endOfLine": "auto" } ] – Kevin Oswaldo Jan 23 '23 at 09:28

score 31 · Answer 8 · answered Dec 26 '20 at 08:17

31

Fixed - My .eslintrc.js looks like this:

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

answered Dec 26 '20 at 08:17

Hamza Waleed

1,334
10
12

Thanks fellow react-native user – Ash Nov 24 '22 at 23:08

score 25 · Answer 9 · edited Dec 14 '20 at 13:45

25

Try this. It works for me:

yarn run lint --fix

or

npm run lint -- --fix

edited Dec 14 '20 at 13:45

Akif

7,098
7
27
53

answered Dec 14 '20 at 13:41

Hakan

1,199
1
14
18

score 21 · Answer 10 · answered Nov 06 '20 at 09:33

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/

Tri Dawn · Answer 11 · 2021-12-06T16:21:03.440

15

In the .eslintrc file add the following:

extends: ['prettier'] and plugins: ['prettier']
rules: {'prettier/prettier': ['error', {endOfLine: 'auto'}]}

In .prettierrc remove this:

endOfLine: 'auto'

It works for me.

edited Dec 06 '21 at 16:21

answered Dec 06 '21 at 16:15

Tri Dawn

540
6
11

score 13 · Answer 12 · answered Mar 20 '21 at 17:28

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"
}

score 11 · Answer 13 · answered May 06 '19 at 02:59

11

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

answered May 06 '19 at 02:59

Waket Zheng

5,065
2
17
30

score 11 · Answer 14 · answered Jan 04 '21 at 20:32

11

Add this to your .prettierrc file and open the VSCODE

"endOfLine": "auto"

answered Jan 04 '21 at 20:32

Vince

776
11
21

score 11 · Answer 15 · answered Jan 14 '22 at 13:47

11

npm run lint -- --fix

Run this command this worked for me

answered Jan 14 '22 at 13:47

Shamaz saeed

387
3
8

For me aswell thank you! – Mojgan Jun 20 '22 at 07:49

score 9 · Answer 16 · answered Sep 04 '21 at 10:58

9

Add these below rule in .eslintrc file and then restart your project.

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

answered Sep 04 '21 at 10:58

zernab hussain

339
3
6

score 7 · Answer 17 · answered Jul 04 '21 at 05:07

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',
  },
],

},

score 7 · Answer 18 · answered Oct 01 '21 at 09:48

7

Solution

1. Disable auto conversion git setting

git --global config core.autocrlf false

2. Remove old cache data

git rm --cached -r .

3. Reset git files

git reset --hard

answered Oct 01 '21 at 09:48

Shraddha Goel

869
7
18

score 6 · Answer 19 · answered Apr 14 '21 at 15:47

6

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.

answered Apr 14 '21 at 15:47

Elias

664
2
11
23

why `input`? How else this suggestion is different from that by koko-js478? – YakovL May 08 '22 at 17:13

score 6 · Answer 20 · edited Apr 25 '21 at 01: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"
}],

score 6 · Answer 21 · answered May 24 '21 at 13:40

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.

score 6 · Answer 22 · answered Jan 05 '22 at 09:12

6

if you have already checked out the code

git config --global core.autocrlf input 


git rm --cached -r . 


git reset --hard

answered Jan 05 '22 at 09:12

Keerthi Reddy Yeruva

861
1
16
43

this would delete all your local git changes, be carefull to execute these commands. – Santosh Karanam Mar 21 '22 at 16:39
Worked for me on windows – Ian Samz Feb 15 '23 at 10:52

ßiansor Å. Ålmerol · Answer 23 · 2022-10-14T02:22:52.603

The best solution is to use .editorconfig. Especially if you are working with a team with different type OS. So disabling prettier in .eslintrc is not a good option at all.

Install .editorconfig from your vscode extension. Create a .editorconfig file in your project root directory and it to your .gitignore file so it won't bother your teammates.

Add this to your .editorconfig file or choose what workflow settings you need from the documentation.

[*]
end_of_line = lf

This will save your file automatically to EOL type lf instead of crlf in windows. Vise versa if using mac. Or depends on the project workflow setup.

The root cause is windows is default to crlf. So every time you try to create a file you will face this prettier Delete 'cr' error.

In Addition

If all the files you got from git contains Delete 'cr'.

Delete your project
Reinstall your git and choose checkout as-is, commit Unix-style line endings
Clone your project from repo again
Use the .editorconfig set up above

the best answer so far, thanks – Ngô Trọng Phúc Jan 09 '23 at 04:02 — Ngô Trọng Phúc, Jan 09 '23 at 04:02
Best answer. Addresses the core problem. – Renato Sanhueza Mar 27 '23 at 14:24 — Renato Sanhueza, Mar 27 '23 at 14:24

score 4 · Answer 24 · answered Oct 08 '21 at 15:56

4

Error appears when I pull code from git, and this work for me:

STEP 1:

git config --global core.autocrlf false

STEP 2:

delete your current folder

STEP 3:

pull code from git again
try running command again

answered Oct 08 '21 at 15:56

Peppers

270
3
5

git config --global core.autocrlf false this command works very well, solving the LF issue on vs code – Frank Guo Jan 24 '22 at 04:57
If you're working on different projects with different configurations you can set the flag locally for that repo by omitting the `--global` flag. Also, you don't need to delete the entire repo and clone it again, just resetting the branch to origin should work. – aitorllj93 Feb 03 '22 at 10:18

score 4 · Answer 25 · answered May 07 '22 at 19:44

4

If you need to use with .prettierrc.js:

module.exports = {
    ...[config params],
    endOfLine: 'auto',
};

Note! Not in rules or prettier/prettier.

Info here https://prettier.io/docs/en/options.html#end-of-line

answered May 07 '22 at 19:44

Sergey Barabanov

51
3

score 4 · Answer 26 · answered Jul 25 '22 at 10:21

4

executing eslint for linting and fixing solved my issue.

eslint . --ext .vue,.js,.jsx,.cjs,.mjs,.ts,.tsx,.cts,.mts --fix --ignore-path .gitignore

or if you have lint script: npm run lint

answered Jul 25 '22 at 10:21

M. Emre Yalçın

608
1
7
10

Alternatively to this, you can use `npm run lint` if your project haves npm linting setup, for some reason on my vue 3 project vscode just get bugged ocasionally with these kind of errors as mention by OP – Gediminas Oct 31 '22 at 10:28

score 3 · Answer 27 · answered Dec 29 '20 at 08:17

3

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.

answered Dec 29 '20 at 08:17

richardwhatever

4,564
5
23
26

Cláudio · Answer 28 · 2021-01-23T23:44:15.903

3

What worked for me was:

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

npm update prettier

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!

edited Jan 23 '21 at 23:44

answered Jan 23 '21 at 23:15

Cláudio

484
1
4
18

1

prettier was up-to-date in my machine, But running npm run lint -- --fix fixed the problem. – Jashan PJ May 12 '21 at 08:59
This work for me with nestjs and windows, thanks! – JazMagno Sep 18 '21 at 00:38
I tried a lot of other solutions proposed here but only this resolved the issue. – codesnerd Jan 06 '22 at 21:55

score 3 · Answer 29 · edited Oct 27 '21 at 11:44

3

edit your .eslintrc.json file and update "prettier/prettier" value shown below.

I face same problem and fixed using below changes.

"prettier/prettier": [
    "error", {
         "singleQuote": true,
         "parser": "flow" 
    }
],

edited Oct 27 '21 at 11:44

Srilal Sachintha

1,335
1
12
18

answered Oct 18 '21 at 00:48

sudhanshu

409
1
5
12

score 2 · Answer 30 · answered Nov 24 '20 at 04:00

2

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

answered Nov 24 '20 at 04:00

Roberto LL

97
2

score 2 · Answer 31 · answered Mar 17 '21 at 08:45

2

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

answered Mar 17 '21 at 08:45

Petr Tripolsky

1,419
15
23

score 2 · Answer 32 · answered Jan 23 '23 at 08:19

2

Delete this line from the file .prettierrc

 "endOfLine": "crlf"

answered Jan 23 '23 at 08:19

Komail Fayazbakhsh

324
4
14

score 1 · Answer 33 · answered Oct 10 '21 at 04:53

Its work for me

step-1 React js root directory find .eslintrc file

Step-2 find in .eslintrc

"prettier/prettier": [
  2,
  {
    "printWidth": 100,
    "singleQuote": true,
    "trailingComma": "none",
    "tabWidth": 2
  }
]

replace with

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

save file and then run

npm start

score 0 · Answer 34 · answered Jan 10 '21 at 18:39

0

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.

answered Jan 10 '21 at 18:39

AndriyFM

1,389
14
11

score 0 · Answer 35 · answered Feb 15 '22 at 21:09

For those using @vue/prettier there may be a conflict between it and eslint which results in this error. Despite being installed along with vue cli, @vue/prettier was a temporary solution until prettier accepted vue natively and that has already been done. The problem can be solved by switching to just 'prettier'

score 0 · Answer 36 · answered Jan 12 '23 at 14:13

You need add rules the file .eslintrc

"extends": ["plugin:prettier/recommended"],
"plugins": ["prettier"],
"rules": {
 "prettier/prettier": ["error"],
 "@typescript-eslint/no-unsafe-call": "off",
 "@typescript-eslint/unbound-method": "off",
 "@typescript-eslint/no-explicit-any": "off",
 "@typescript-eslint/no-unsafe-member-access": "off",
 "@typescript-eslint/no-unsafe-assignment": "off",
 "@typescript-eslint/no-empty-function": "off",
 "@angular-eslint/no-empty-lifecycle-method": "off",
 "@typescript-eslint/no-unused-vars": ["off"],
 "@typescript-eslint/require-await": "off",
 "@typescript-eslint/ban-types": "off"
}

score 0 · Answer 37 · answered Apr 07 '23 at 12:26

0

If you already added the rule

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

in your .prettierrc.js but the issue isn't fixed, just restart the node server. npm start.

answered Apr 07 '23 at 12:26

user3856437

2,071
4
22
27

Bilal Ahmad · Answer 38 · 2023-06-28T15:20:44.227

0

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

RESTART YOUR VSCODE after adding this in your project's '.eslintrc.js' file.

And also add

module.exports = { 
  endOfLine: 'auto',
  // keep other values 
}

in your project's '.prettierrc.js'

edited Jun 28 '23 at 15:20

answered Jun 28 '23 at 15:04

Bilal Ahmad

781
8
10

score -1 · Answer 39 · answered Jul 23 '23 at 09:41

-1

I tried all these answers given in this question but none of them completely fixed the issue. But after trying & searching for the solution i got the solution from a youtube video that says, to add the following lines in your .eslintrc.js (Or whatever es lint config) file...

rules: {
    // rules...
    "prettier/prettier": 0
}

This setting removed all prettier related errors.

answered Jul 23 '23 at 09:41

Rohit Kumar

87
1
5

This is not a viable solution in my opinion, since you're just bypassing prettier rules here. – elkolotfi Aug 23 '23 at 09:51

score -3 · Answer 40 · answered Mar 24 '23 at 01:55

-3

So you can disable or uninstall the 'eslint' extension for solve this problem, it worked for me.

answered Mar 24 '23 at 01:55

Sina Kordestani

5
2

Why do I keep getting "[eslint] Delete `CR` [prettier/prettier]"?

40 Answers40

Solution

Root cause of the problem:

Reference

Error appears when I pull code from git, and this work for me:

STEP 1:

STEP 2:

STEP 3:

Linked

Related