37. Installing ESLint
이 강의에서는 코드 품질을 유지하기 위한 도구인 ESLint에 대해 설명합니다.
주요 내용은 다음과 같습니다:
- ESLint 개요: JavaScript는 엄격한 코드 형식 규칙을 적용하지 않지만, ESLint는 더 엄격한 기준을 적용하여 코드의 일관성과 오류를 줄일 수 있습니다.
ESLint는 개발자가 설정한 규칙을 위반할 경우 알려줍니다. - 설치 및 통합: Vite는 ESLint를 자동으로 지원하지 않으므로 수동으로 ESLint를 프로젝트에 통합해야 합니다.
이를 위해vite-plugin-eslint
패키지를 설치하고, 프로젝트 루트 디렉토리에vite.config.js
파일을 생성하여 Vite 설정을 정의합니다. - ESLint 구성: ESLint는 프로젝트 디렉토리에서 설정 파일을 찾아 그에 따라 코드를 검사합니다.
설정 파일을 생성하고 구성하는 과정은 다음 강의에서 다룰 예정입니다.
이 강의는 ESLint를 통해 JavaScript 코드의 품질을 높이는 방법과 Vite와의 통합 과정을 설명하며, ESLint의 설치 및 기본적인 통합 방법에 대해 소개합니다.
주의
현재 내용은 vite version 3 기준이라 (지금 5버전, 2024년 1월 13일 기준)이므로 약간 내용이 달라졌을 수도 있음
npm i -D eslint
npm i -D vite-plugin-eslint
// vite.config.js
import { defineConfig } from 'vite'
import eslint from 'vite-plugin-eslint'
export default defineConfig({
plugins: [
eslint(),
]
})
위 상태까지 설정하면 [vite] Internal server error: No ESLint configuration found in ~~
에러가 발생합니다.