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

Interconnect

Answer 1

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.

Photobathic

This is more of a hack. The other answer by @The Coder is correct. You need to change the config of the project – Mouthwatering

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. – Intoxicant

This response is totally wrong. If the team agreed to have a linting rule with line-ending LF and you have a windows machine, then you must implement a set of steps so that everything works on your machine without touching the linting rule. – Everyman

Answer 2

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://mcmap.net/q/100736/-how-can-i-write-a-eslint-rule-for-quot-linebreak-style-quot-changing-depending-on-windows-or-unix

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

Fermat

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. – Fermat

Answer 3

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.

Yaelyager

How to set this configuration to global in one project? i have to do this for every file – Isopod

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. – Shriek

Answer 4

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

Gynous

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? – Leia

@Leia Thanks! I do not see any downside. – Gynous

trying to understand why this could be less error prone of : 'linebreak-style': ['error', 'windows'], – Abukir

@CarmineTambascia when team members work on the same repo with different machine OS(windows, Linux and Mac) then it will take appropriate line ending -eslint.org/docs/rules/linebreak-style#options – Gynous

I undertood that but anyway this won't work with any CPU of 64 byte, and I don't see what add to the exception of add only "windows" and include all of them – Abukir

@CarmineTambascia For any windows system, process.platform will always return win32. so, There is no issues. – Gynous

Thank you. This answer worked perfectly for me. I'm in the situation where we have many devs working in Mac and Windows, and we use a .gitattributes file to have the line endings automatically converted for the native OS. – Underwear

Answer 5

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

Bernitabernj

Voted up for the useful photos, 10x – Prelect

"go to File -> Preferences -> Settings" What app should this be done in? – Ludicrous

Prettier setting was my issue. Thanks CLUTCHER – White

Please note, what is an editor is in a first screenshot. – Indite

Answer 6

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

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

Robbins

Answer 7

git config core.autocrlf false

git rm --cached -r .

git reset --hard

Flummox

Consider adding an explanation as to how these git commands address the problem described in the question? – Gadhelic

This is the one that worked for me but I have no idea what's happening – Burned

@Burned I'm pretty sure when you git clone it messes up with auto converting the linebreaks, and basically this turns it off – Harrier

Answer 8

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

[core] autocrlf = false

Mccrea

Your fix worked for me, editing eslintrc to add linebreak-style did not work. – Intoxicant

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. – Mouthwatering

For those looking for the file. On unix: nano ~/.gitconfig – Felike

@Felike This will change the setting on the user-level, meaning it will be applied to all projects! Most likely you'd only want to change it for a specific project, in which case you'd edit .git/config in the repo directory instead. – Raycher

autocrlf = false didn't work for me, by the way. I manually converted all line breaks to LF, but Git would immediately convert them back to CRLF in every modified file as soon as I tried to commit. The correct setting for me to be able to keep LF was autocrlf = input (and no re-checkout is necessary). – Raycher

Answer 9

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.

Delative

Answer 10

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/

Precritical

Answer 11

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

Trotyl

where exactly is this? – Gaul

Answer 12

In case you want to change to LF and you are using VS Code you can do it per file like so:

Spinal

Answer 13

I set linebreak-style to 0, but not working.

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

so then I found out need to change every files from "CRLF" to "LF", and that take lots time.

When cloning a project, Git automatically converts LF to CRLF which causes the error.

git config --global core.autocrlf false

To avoid this automatic conversion, run “git config --global core.autocrlf false” in Git Bash before cloning the project.

Prosenchyma

When cloning a project, Git automatically converts LF to CRLF which causes the error. Run "git config core.autocrlf false" in Git Bash before cloning the project will help. – Prosenchyma

Answer 14

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.

Blakeney

Answer 15

In my case (vue.js project, created using vue-cli) the lint problem Expected linebreaks to be 'LF' but found 'CRLF' linebreak-style was related to Prettier. From version >= 2 Prettier replace all line endings with "lf": https://prettier.io/docs/en/options.html#end-of-line

Since I'm using Windows to develop I set these 3 (git, eslint, prettier) configuration to avoid line endings problems:

1. Git: I set git config --global core.autocrlf true
2. eslint: in .eslintrc.js file I configured:

      module.exports = {
      rules: {
        'linebreak-style': ['error', 'windows'],
      },
    };

3. prettier: And finally in prettier.config.js:

module.exports = {
    endOfLine: "crlf",
};

Adamik

I believe the issue has to do more about use codebase that is been "saved" with LF rules and then indeed work on Windows that use 'CRLF'. The question is, are the above setting guarantee that once the code is pushed, is back to LF formatting? – Abukir

What I meant with my previous comment is that as from another answer, in VSC is possible to toggle between LF and crlf but then that is seen as a change by git, but in reality there isn't been any or any in term of a real commit. – Abukir

I have read further eslint.org/docs/rules/linebreak-style and this eslint exception rule is the most simple and working to avoid this error pop up in vsc in windows. Alternative is provide the .gitattributes file – Abukir

Answer 16

The "endOfLine": "auto" setting in .eslintrc.js and .prettierrc files worked for me.

File .eslintrc.js should have:

rules: {
    /*  ...the other code is omitted for the brevity */
    'arrow-body-style': [1, 'as-needed'],
    'import/extensions': 'off',
    'prettier/prettier': [
        'error',
        {
            semi: false,
            singleQuote: true,
            useTabs: true,
            endOfLine: 'auto', /* this setting should be included */
        },
    ],

File .prettierrc should have:

{
    "semi": false,
    "trailingComma": "all",
    "singleQuote": true,
    "useTabs": true,
    "tabWidth": 2,
    "endOfLine": "auto" /* this setting should be included */
}

Vinic

Answer 17

Tips: Make sure you have installed Git as the picture if not do that first. You can take other features as default, You can choose visual studio code as the default editor. helps you a lot later.

Windows Users: Uninstall Visual Studio Code then reinstalled it again and EditorConfig should work just fine.

NOTE => Uninstalling Visual Studio Code still leaves the old settings and extensions! remove Visual Studio Code on Windows completely

Uninstalled Visual Studio

1. This PC > Local disck (C) Users > CurrentUser > AppData > Local > Programs > Microsoft VS Code
   1. Unins000.exe or Uninstall it from conrol panel
2. This PC > Local disck (C) Users > CurrentUser > AppData > Local > Roaming
   1. Code => Folder should be delete it
3. This PC > Local disck (C) Users > CurrentUser >
   1. .vscode => Folder should be delete it
4. reinstall vs code it should work now.

Oneself

Answer 18

I just want to add the easier way. On the bottom right of VScode click the LF or CRLF to toggle between them. See Photo

Rashad

Answer 19

for me, I fixed the issue by setting "endOfLine": "lf" in the.prettierrc file.

Dictograph

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center. – Gerhan

Answer 20

None of the answers above really worked for me. All of them are temporary solutions that are going to work for you but not for the team, like changing the linting rule or totally disabling it. If the team agreed to have a linting rule with line-ending LF and you have a windows machine, then you must implement a set of steps so that everything works on your machine without touching the linting rule.

First of all, check your global settings:

git config --global --list

You want to make sure that you have the value

core.autocrlf=false

If that's not the case, then run:

git config --global core.autocrlf false

This command disables automatic line ending conversion, ensuring that Git will not automatically change line endings when you commit or check out files.

In the terminal, move to your solution folder, example:

C:\git\my_project>

and run the following command:

git config core.eol lf

This will set the line ending type to use in the working directory for files that are marked as text

In your solution folder you should find a file named .gitattributes, open it and make sure you have the following instruction into it:

* text eol=lf

If not there, create it.

This will tell Git to always convert line endings to LF on checkout. You should use this for files that must keep LF endings, even on Windows.

Finally you need to refresh your repository (Stash or discard you local changes). To update all files on the current branch to reflect the new configuration, run the following commands:

git rm -rf --cached .
git reset --hard HEAD

To display the rewritten, normalized files, run the following command.

git status

Optionally, to commit any outstanding changes in your repository, run the following command.

git commit -m "Normalize all the line endings"

Additionally, if you are using VS Code, you can enforce the LF line ending:

File -> Preferences -> Settings

References:

• https://docs.github.com/en/get-started/getting-started-with-git/configuring-git-to-handle-line-endings

• https://git-scm.com/docs/git-config

Everyman

Answer 21

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

eslint filePath --fix

Overhang

Answer 22

In my case, the LF rule was set in a file read by the maven-checkstyle-plugin in pom.xml. The ${skipCheckstyle} environment variable was not set. This way I skipped the whole check.

<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-checkstyle-plugin</artifactId>
<configuration>
    <skip>${skipCheckstyle}</skip>
    <configLocation>${top.dir}/src/main/config/checkstyle/checker.xml</configLocation>

Underground

Answer 23

run: $ git config --global core.autocrlf false

delete repo and clone again

Dorita