우테코 프리코스 설정(ESLint + Prettier + Airbnb Style)

2023년 11월 2일

소개

우테코 프리코스의 코딩 스타일 컨벤션인 Airbnb Style을 지키기 위해 ESLint, Prettier을 설치한 내용을 메모하기 위한 글

설치

  1. ESLint, Prettier 패키지 설치
npm install -D eslint prettier
  1. airbnb eslint 설정 패키지 설치
npx install-peerdeps --dev eslint-config-airbnb
  1. prettier eslint 플러그인 및 설정 패키지 설치
npm install -D eslint-config-prettier eslint-plugin-prettier

설정 파일

.eslintrc.cjs
module.exports = {
    extends: ['airbnb', 'plugin:prettier/recommended'],
    rules: {
      'prettier/prettier': ['error', { endOfLine: 'auto' }], // 공백 문자 호환 설정
      'operator-linebreak': ['error', 'before'], // 할당 연산자 줄바꿈 설정
      'max-depth': ['error', 2], // 들여쓰기 깊이(depth) 제한 (2주차 미션 요구 사항)
      'import/extensions': 'off', // node 환경에서 실행하기 위해 extension off
    },
    parserOptions: {
      ecmaVersion: 13, // class private 속성 #을 위해 ecamVersion 설정
    },
    env: {
      jest: true, // 테스트를 위한 jest true 설정
    },
};
.prettierrc.cjs
module.exports = {
    printWidth: 80, // 한 줄 최대 문자 수
    tabWidth: 2, // 들여쓰기 시, 탭 너비
    useTabs: false, // 스페이스 대신 탭 사용
    semi: true, // 문장 끝 세미콜론 사용
    singleQuote: true, // 작은 따옴표 사용
    trailingComma: 'all', // 꼬리 콤마 사용
    bracketSpacing: true, // 중괄호 내에 공백 사용
    arrowParens: 'always', // 화살표 함수 단일 인자 시, 괄호 사용
    proseWrap: 'never', // 마크다운 포매팅 제외
    endOfLine: 'auto', // 개행문자 유지 (혼합일 경우, 첫 줄 개행문자로 통일)
};
.prettierignore
node_modules/

댓글