why?
最近在开源的相关代码,因为现在主要使用 Window 系统,而 WSL2 子系统在使用 Cypress 等需要原生系统支持之后,就逐步在使用 Window,下面是看到源码的时候的情况,ESlint 报告了无数的错误:
🙂🙂🙂 ESLint 报错如下:Expected linebreaks to be 'LF' but found 'CRLF'.eslint linebreak-style
这可能是个普遍的问题,需要一些解决方案:
- 使用 Linux/MacOS 编程,直接与服务端环境基本一致。
- 找到原理,解决问题(更多可能这个问题已经解决了,你需要只是发现,然后自己修复,下面就是发现和修复的过程,可以让部分读者少走弯路)
换行符种类,一个表格总结:
换行符类型 | 含义和用途 | ASCII 值 | 常见操作系统 | 换行字符真实字符 |
---|---|---|---|---|
LF | Line Feed(换行) | 10 | Unix、Linux、macOS | \n |
CRLF | Carriage Return(回车) + Line Feed(换行) | 13 + 10 | Windows | \r\n |
eslint 中处理换行符
linebreak-style 配置项目
- es报错根源配置项目
ts
// 使用字符串或数字
/*eslint linebreak-style: ["error", "unix"]*/
/*eslint linebreak-style: ["error", "windows"]*/
"linebreak-style": [
2, // 改为 1
"unix"
]
- 关闭 eslint 的报错或者警告配置
ts
"linebreak-style": [
0,
"unix"
],
Editorconfig
使用 editorconfig 统一我们在编码时候的换行符
sh
# 针对所有文件
[*] end_of_line = lf
# 正对 js 文件
[*.js] end_of_line = lf
使用 vscode 插件创建 .editorconfig
文件。
vscode 中的换行符
注意:这是 vscode 插件,其他的编辑器可能已经了内置方案
VS Code 插件
VS Code 中切换换行符
- 使用命令
Ctrl + Shift + P 输入:Change End of Line Sequence 选择:lf 或者 crlf
- 切换图标
在 VS Code 状态栏中,提供了 Select End of Line Sequence
项目
git 中配置换行符
gitattributes
文件
当执行 git 相关命令时,.gitattributes 文件允许你指定由 git 使用的文件和路径的属性,例如:
git commit
等。属性中包含一个*eol*(end of line)
用来处理 git 中换行符。
换句话说,每当有文件保存或者创建时,git 会根据指定的属性来自动地保存。
在当前目中的根目录中添加: .gitattributes
文件,并配置:
arduino
* text=auto eol=lf
解决之后
清爽如初,同时也自动添加了👇
的箭头,表示是 \n
字符。
小结
本文从实际问题 eslint 报告不同编程环境换行符的错误实际出发,探索换行符,以 VSCode 编辑器为示例,讲解了换行符号的基础知识点。以及esline 相关配置,使用 editorconfig 来统一编辑器换行符,已经在 vscode 中使用 插件配置和切换换行符,最后解决通过 gitattributes 来解决 git 中的换行问题。