eslint 및 프리티어 설정 적용하기

yarn add --dev eslint

yarn add --dev eslint

yarn run eslint --init

 

 

.estlintrc.json

{
  "env": {
    "node": true,
    "es2021": true
  },
  "extends": ["eslint:recommended", "prettier"],
  "globals": {
    "Atomics": "readonly",
    "SharedArrayBuffer": "readonly"
  },
  "parserOptions": {
    "ecmaVersion": "latest",
    "sourceType": "module"
  },
  "rules": {
    "no-unused-vars": ["warn", { "args": "none", "ignoreRestSiblings": true }],
    "no-console": "off",
    "prefer-const": "error",
    "no-var": "error",
    "eqeqeq": ["error", "always"],
    "arrow-spacing": ["error", { "before": true, "after": true }]
  }
}

 

// 내용 설명

1. env.es2021: 최신 ECMAScript 표준(ES2021)을 지원합니다. Node.js 최신 버전은 ES2021 이상의 문법을 대부분 지원합니다.
2. parserOptions.ecmaVersion: "latest"를 사용하여 가장 최신 ECMAScript 버전을 지원합니다.
3. sourceType: "module"로 설정하여 ES 모듈(import/export)을 사용할 수 있도록 지원합니다. 최신 Node.js는 ESM을 기본 지원합니다.
4. 규칙 추가:
• prefer-const: 가능하면 const를 사용하도록 강제합니다.
• no-var: var 사용을 금지하고 let 또는 const를 사용하도록 권장합니다.
• eqeqeq: 엄격한 동등 연산(=== 및 !==) 사용을 강제합니다.
• arrow-spacing: 화살표 함수에서 더 나은 가독성을 위해 공백을 요구합니다.
5. 기존 규칙 개선:
• no-unused-vars: 사용되지 않은 변수에 경고를 표시하면서, 함수 인수(args)는 검사하지 않으며 구조 분해 할당에서 남은 속성(...rest)은 무시합니다.

 

프리티어 파일 생성

.prettierrc

{
  "singleQuote": true,         // 문자열에 작은따옴표 사용
  "semi": true,                // 구문 끝에 세미콜론 추가
  "useTabs": false,            // 들여쓰기에 공백 사용
  "tabWidth": 2,               // 탭 폭 2칸
  "trailingComma": "es5",      // ES5에서 허용된 곳에만 후행 쉼표 추가
  "printWidth": 100,           // 줄 길이를 100자로 제한
  "arrowParens": "always",     // 화살표 함수의 매개변수에 괄호를 항상 추가
  "bracketSpacing": true,      // 객체 리터럴에서 괄호 사이의 공백 허용
  "endOfLine": "lf"            // 줄바꿈은 LF로 통일
}

 

마지막으로 .prettier 파일을 eslint가 관리하지 못하게 하는 설정 추가.

yarn add eslint-config-prettier

 

 

이외에도 vscode에 확장 익스텐션을 따로 eslint, prettier를 설치해야한다.