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

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();

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

[core] autocrlf = false

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.

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.

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

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

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/

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

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

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.