eslint와 prettier 충돌로 인한 오류 해결 방법
📌 오류문구
Delete ··
Insert ␍⏎
Replace··
with↹
팀프로젝트 하면서 계속 이런 오류가 생겼다.
처음엔 이게 무슨말인가 당황스러웠지만 하도 많이 봐서 이제는 익숙해져버린..
eslint와 prettier가 충돌해서 생기는 오류라고 한다.
·· : space
␍⏎ : enter
↹ : tab
외계어같던 저 문구들은 각각 space, enter, tab을 표현한 문구였다.
📌 해결방법
Replace
··
with↹
이 오류는 space 부분을 tab으로 바꾸라는 뜻인데 eslint에서는 space를 이용하고 prettier에서는 tab을 사용하기때문에 발생하는 오류라고 한다. 그래서 eslint 설정값을 바꿔주면 해결된다.
- eslintrc.js파일에서 useTabs: false로 수정하기
rules: {
'prettier/prettier': [
'error',
{
useTabs: false,
},
],
},
Delete ␍
window와 linux에서 사용하는 줄넘김값이 달라서 생기는 문제
- window(CRLF), linux(LF)
✔ 파일 하단에 CRLF 라고 써있는 부분을 눌러 LF로 수정해주기(각 파일마다 설정해줘야함)
✔ eslintrc.js파일에서 endOfLine: 'auto' 추가하기
rules: {
'prettier/prettier': [
'error',
{
endOfLine: 'auto',
},
],
},
✔ vscode 기본 설정을 LF로 바꾸기(새로운파일 생성시 적용)
file -> preferences -> Settings -> 'eol'검색 -> Files:Eol \n
선택하기 (\n
: LF, \r\n
: CRLF)
✔ vscode 설정 확인하기
- Format On Save에 체크가 되어있는지, Default Formatter가 Prettier로 되어있는지 확인하기
👩 그리고 다 해보았지만 해결이 안 됐던 나는 Format On Save 체크를 해제하고 오류가 난 부분을 찾아 일일이 수정해주었다...
새벽에 이것때문에 아무것도 못하고 멘붕이었는데 이렇게라도 작업을 진행할 수 있어 다행이었다. 호옥시나 나처럼 뭘해도 오류가 사라지지않는 분들은 자동수정기능을 끄고 수정해보시길..
Author And Source
이 문제에 관하여(eslint와 prettier 충돌로 인한 오류 해결 방법), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@suyeon-hong/eslint와-prettier-충돌로-인한-오류-해결-방법저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)