본문 바로가기
Frontend2026년 5월 24일3분 읽기

ESLint 10 flat config — Airbnb·Standard 호환 라이브러리 마이그레이션

YS
김영삼
조회 347
ESLint 10 flat config — Airbnb·Standard 호환 라이브러리 마이그레이션

핵심 요약

ESLint 10이 정식, .eslintrc 완전 제거 + flat config 강제. 사내 70개 프로젝트 마이그레이션, 자동 도구로 90% 처리, 나머지 10%는 Airbnb·Standard 호환 packge 부재로 직접. 사후 정리.

1. 핵심 변화

  • .eslintrc.* 미인식 — eslint.config.js만
  • extends 문자열 → 객체 import
  • env, parserOptions → languageOptions로 통합
  • rules는 동일하나 plugin 이름 prefix 통합

2. 자동 변환

npx @eslint/migrate-config .eslintrc.json

단순 설정은 100%, plugin 많으면 60%. 결과 검토는 필수.

3. Airbnb 호환 — eslint-config-airbnb-flat

커뮤니티 패키지 eslint-config-airbnb-flat이 사실상 표준. 공식은 아직 legacy. 마이그레이션 시 옵션 변경 7개 — strict-mode, no-unused-vars 등.

4. Standard·XO·Prettier 통합

Standard는 flat 지원, XO는 11+에서. Prettier는 plugin이 아닌 eslint-config-prettier로 비활성 처리, 포맷팅은 Prettier에 위임 — ESLint는 lint만.

5. CI 적용

// eslint.config.js
import js from '@eslint/js'
import ts from 'typescript-eslint'
import react from 'eslint-plugin-react'

export default [
  js.configs.recommended,
  ...ts.configs.recommended,
  { plugins: { react }, rules: { 'react/jsx-key': 'error' } },
]

6. 함정

  • .eslintignore 미지원 — files/ignores 필드로 이전
  • IDE 통합 — VSCode ESLint extension 3.0+ 필요
  • monorepo — 워크스페이스마다 config 두는 게 안정적, root 하나로 묶으면 cache miss
  • legacy 모드 옵션 ESLINT_USE_FLAT_CONFIG는 9에서 제거

댓글 0

아직 댓글이 없습니다.
Ctrl+Enter로 등록