[TIL] import 구문 자동 삭제(eslint)

eslint-plugin-unused-imports

오늘은 프로젝트 세팅 시 사용하면 유용한 eslint 플러그인을 적용할 예정이다.

1. eslint 다운로드

먼저 ellint를 다운로드 받는다.

 //  npm 사용자
npm i eslint --save-dev

//  yarn 사용자
yarn add -D eslint

그리고 VSCode 확장 프로그램에서 eslint를 설치한다.

2. plugin 다운로드

이후에 해당 플러그인을 다운받으면 된다.

npm install eslint-plugin-unused-imports --save-dev

yarn add -D eslint-plugin-unused-imports

3. init

이제 .eslintrc.json 파일을 만들어주면 된다.

npx eslint --init

위 명령어를 입력하면 파일이 자동으로 생긴다.

4. .eslintrc.json

{
	"plugins": ["unused-imports"],
	"rules": {
		"no-unused-vars": "off", // or "@typescript-eslint/no-unused-vars": "off",
		"unused-imports/no-unused-imports": "error",
		"unused-imports/no-unused-vars": [
			"warn",
			{ "vars": "all", "varsIgnorePattern": "^_", "args": "after-used", "argsIgnorePattern": "^_" }
		]
	}
}

해당하는 부분을 찾아서 위처럼 입력하면 된다. 없다면 위의 형태로 넣어준다.

5. 저장 시 안쓰는 import 삭제처리

이제 저장하면 안쓰는 import구문은 삭제될 것이다.