Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style

Question

When using eslint in the gulp project i have encountered a problem with error like this
Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style and I am using Windows environment for the running gulp and the entire error log is given below

 Kiran (master *) Lesson 4 $ gulp
 Using gulpfile c:\Users\Sai\Desktop\web-build-tools\4\
 gulpfile.js
 Starting 'styles'...
 Finished 'styles' after 17 ms
 Starting 'lint'...
 'lint' errored after 1.14 s
 ESLintError in plugin 'gulp-eslint'
 sage: Expected linebreaks to be 'LF' but found 'CRLF'.
 ails: fileName: c:\Users\Sai\Desktop\web-build-tools\4\js\extra.js



$>Users\Sai\Desktop\web-build-tools\4\js\extra.js
error  Expected linebreaks to be 'LF' but found 'CRLF'  linebreak-style

I have also including extra.js file as the error indicating possible mistake.

function getWindowHeight() {
    return window.innerHeight;
}

getWindowHeight();

Dheeraj Vepakomma · Accepted Answer · 2016-06-15T05:17:32.013

Check if you have the linebreak-style rule configure as below either in your .eslintrc or in source code:

/*eslint linebreak-style: ["error", "unix"]*/

Since you're working on Windows, you may want to use this rule instead:

/*eslint linebreak-style: ["error", "windows"]*/

Refer to the documentation of linebreak-style:

When developing with a lot of people all having different editors, VCS applications and operating systems it may occur that different line endings are written by either of the mentioned (might especially happen when using the windows and mac versions of SourceTree together).

The linebreaks (new lines) used in windows operating system are usually carriage returns (CR) followed by a line feed (LF) making it a carriage return line feed (CRLF) whereas Linux and Unix use a simple line feed (LF). The corresponding control sequences are "\n" (for LF) and "\r\n" for (CRLF).

This is a rule that is automatically fixable. The --fix option on the command line automatically fixes problems reported by this rule.

But if you wish to retain CRLF line-endings in your code (as you're working on Windows) do not use the fix option.

This is more of a hack. The other answer by @The Coder is correct. You need to change the config of the project — user959690, Jul 06 '20 at 21:58
I am not sure if this solution works for multi platform developers where some developers work in Unix and some on Windows. I think this should be best handled by the version control not the IDE or Lint is a moot point. Answer by @vnxyz worked and should be accepted IMO. — MG Developer, Dec 18 '20 at 19:19

The Coder · Answer 2 · 2017-10-13T01:10:02.333

176

I found it useful (where I wanted to ignore line feeds and not change any files) to ignore them in the .eslintrc using linebreak-style as per this answer: https://stackoverflow.com/a/43008668/1129108

module.exports = {
  extends: 'google',
  quotes: [2, 'single'],
  globals: {
    SwaggerEditor: false
  },
  env: {
    browser: true
  },
  rules:{
    "linebreak-style": 0
  }
};

edited Oct 13 '17 at 01:10

answered Jun 20 '17 at 20:55

The Coder

3,277
1
24
34

3

It's sad, the highest up-voted answer disables linting of linebreak instead of fixing the issue – Cezary Daniel Nowak Aug 11 '20 at 09:33
1

Actually the second highest (and not selected) answer, in my case I was working in a repository where the primary people working on it were on Macs and I was code reviewing on a PC, didn't really want to change anything for that reason. – The Coder Sep 02 '20 at 05:34

score 110 · Answer 3 · edited Aug 19 '19 at 09:46

110

If you are using vscode and you are on Windows i would recommend you to click the option at the bottom-right of the window and set it to LF from CRLF. Because we should not turn off the configuration just for sake of removing errors on Windows

If you don't see LF / CLRF, then right click the status bar and select Editor End of Line.

edited Aug 19 '19 at 09:46

Geoff

543
2
6
21

answered Sep 20 '18 at 05:14

Mr_Perfect

6,986
9
30
59

8

How to set this configuration to global in one project? i have to do this for every file – Progs Jan 02 '19 at 16:21
5

The global setting in VSCode seems to be: `Settings -> Text Editor -> Files -> Eol`, set to `\n`. This appears to only apply to new files though, you'll still have to switch each existing file over manually. – V. Rubinetti May 24 '19 at 17:52
The accepted answer (@Dheeraj Vepakomma) and this one both helped me as they complemented on my issue. Thanks! – Rodrigo.A92 Jun 23 '20 at 16:48

score 16 · Answer 4 · answered Oct 19 '19 at 03:45

16

If you want it in crlf (Windows Eol), go to File -> Preferences -> Settings. Type "end of line" in the User tab and make sure Files: Eol is set to \r\n and if you're using the Prettier extension, make sure Prettier: End of Line is set to crlf. Finally, on your eslintrc file, add this rule: 'linebreak-style': ['error', 'windows']

answered Oct 19 '19 at 03:45

CLUTCHER

1,078
1
11
21

4

Voted up for the useful photos, 10x – benshabatnoam Apr 20 '20 at 13:47
"go to File -> Preferences -> Settings" What app should this be done in? – JeffreyPia Apr 24 '20 at 21:32

vnxyz · Answer 5 · 2019-02-21T09:54:53.430

12

Just made autocrlf param in .gitconfig file false and recloned the code. It worked!

[core] autocrlf = false

edited Feb 21 '19 at 09:54

answered Feb 14 '19 at 07:28

vnxyz

176
1
7

Your fix worked for me, editing eslintrc to add linebreak-style did not work. – MG Developer Dec 18 '20 at 19:16
That may cause more issues than it solves since the autocrlf is very helpful when mixing Windows and Unix as Windows tools will add crlf and unix tools lf. – user959690 Feb 17 '21 at 23:59

score 11 · Answer 6 · answered Dec 31 '20 at 09:33

11

Here is a really good way to manage this error. You can put the below line in .eslintrc.js file.

Based on the operating system, it will take appropriate line endings.

rules: {
        'linebreak-style': ['error', process.platform === 'win32' ? 'windows' : 'unix'],
 }

answered Dec 31 '20 at 09:33

H_H

606
5
17

This is a clever way to manage this error with team members on both Mac and Windows machines. Is there a downside that I don't see? – Scott May 18 '21 at 13:53
1

@Scott Thanks! I do not see any downside. – H_H May 19 '21 at 12:54

score 9 · Answer 7 · answered Nov 14 '18 at 11:17

Happen with me because I ran git config core.autocrlf true and I forgot to rever back.

After that, when I checkout/pull new code, all LF (break line in Unix) was replaced by CRLF (Break line in Windows).

I ran linter, and all error messages are Expected linebreaks to be 'LF' but found 'CRLF'

To fix the issue, I checked autocrlf value by running git config --list | grep autocrlf and I got:

core.autocrlf=true
core.autocrlf=false

I edited the global GIT config ~/.gitconfig and replaced autocrlf = true by autocrlf = false.

After that, I went to my project and do the following (assuming the code in src/ folder):

CURRENT_BRANCH=$(git branch | grep \* | cut -d ' ' -f2);
rm -rf src/*
git checkout $CURRENT_BRANCH src/

score 7 · Answer 8 · answered May 04 '19 at 07:15

7

If you are using vscode I would recommend you to click the option at the bottom-right of the window and set it to LF from CRLF..this fixed my errors

answered May 04 '19 at 07:15

Athif Shaffy

547
3
9
20

where exactly is this? – KansaiRobot May 13 '19 at 05:26
2

that's the fix for me! 10x – Barbu Barbu Jun 13 '19 at 13:01
1

It fixed my problem. – Richard Vergis Jan 16 '20 at 03:38

score 6 · Answer 9 · answered Jul 09 '20 at 09:58

6

The same situation occurred when I was using VSCode with eslint. If you use VSCode,

1 - Click area that name can be both LF or CRLF where at the bottom right of the VScode.

2 - Select LF from the drop-down menu.

That's worked for me.

answered Jul 09 '20 at 09:58

Serhan C.

742
1
8
8

score 2 · Answer 10 · answered Jun 11 '19 at 12:41

2

If you are using WebStorm and you are on Windows i would recommend you to click settings/editor/code style/general tab and select "windows(\r\n) from the dropdown menu.These steps will also apply for Rider.

answered Jun 11 '19 at 12:41

binary_fm

154
1
5

score 1 · Answer 11 · answered Apr 03 '21 at 17:05

1

add to our rule in the .eslintrc file 'linebreak-style':0 in Vue js

  rules: {
    'linebreak-style':0,
  }

answered Apr 03 '21 at 17:05

Francisco Estrada

51
1

score 0 · Answer 12 · answered Apr 23 '21 at 09:40

0

Try using the linter's --fix flag to resolve the issue.

eslint filePath --fix

answered Apr 23 '21 at 09:40

user8818954

1

score 0 · Answer 13 · answered Apr 27 '21 at 20:12

0

git config core.autocrlf false

git rm --cached -r .

git reset --hard

answered Apr 27 '21 at 20:12

Hakan Yıldırım

11
1

Consider adding an explanation as to how these git commands address the problem described in the question? – JohnH Apr 27 '21 at 21:12

Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style

13 Answers13

Linked