eslint 빨간줄 해결하기

expected indentation of 2 spaces but found 4.

prettier의 설정과 eslint 내부의 설정이 충돌해 생겨나는 문제

해결방법

npm i --save-dev eslint-config-prettier

설치후 .eslintrc.js에서 extends 배열 안에 prettier옵션 추가

module.exports = {
	// ...
	extends: ['airbnb', 'prettier'],
};

Unexpected use of file extension "js" for "파일명.js"

import시 확장자명을 명시해주어 생기는 문제

해결방법

rules안에 아래 두 옵션 추가

module.exports = {
	// ...
	rules: {
		'import/prefer-default-export': 'off',
		'import/extensions': ['off'],
	},
};

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

개행문제 관련으로 생기는 에러

해결방법

rules 내부에 linebreak-style 옵션 추가

module.exports = {
	// ...
	rules: {
		'linebreak-style': 0,
	},
};

'document' is not defined.

eslint의 env모드에서 browser를 true로 설정하지 않아 생기는문제
브라우저 상에서 돌아가는 js파일이라면 true, 마찬가지로 js파일이 어디에서 실행되느냐에 따라 env 설정을 true/false로 변경해줘야함

해결방법

module.exports = {
	env: {
		browser: true,
		es6: true,
		node: true,
	},
    // ...
}

refer

https://interacting.tistory.com/143
https://kjwsx23.tistory.com/545
https://ddeck.tistory.com/48

eslint 설정할때마다 비슷한 에러를 만나는 것 같아 보이는 에러들을 전부 기록하고 있다.. 새로 생기면 그때그때마다 추가할 예정!
틀리거나 잘못된 정보가 있다면 댓글로 얘기해주시면 감사하겠습니다~!