[vscode] eslint 설정하기

 

vscode 에 eslint 플러그인을 설치한다

 

eslint 패키지를 설치한다

yarn add eslint --dev
# yarn add eslint-plugin-node --dev

 

eslint 를 초기화한다

$ npx eslint --init
✔ How would you like to use ESLint? · problems
✔ What type of modules does your project use? · commonjs
✔ Which framework does your project use? · none
✔ Does your project use TypeScript? · javascript
✔ Where does your code run? · node
The config that you've selected requires the following dependencies:

eslint, globals, @eslint/js
✔ Would you like to install them now? · No / Yes
✔ Which package manager do you want to use? · yarn

 

eslint.config.mjs 파일이 생성된다

터미널에서 아래 명령을 실행해서 eslint 가 동작하는지 확인해 본다

## 전체 출력 (error, warning 등)
$ npx eslint .

## error 만 출력
$ npx eslint . --quiet

정상적으로 동작이 되면 error 등이 출력된다

 

eslint config 를 설정한다

// eslint.config.mjs

import globals from "globals";
import pluginJs from "@eslint/js";

export default [
  pluginJs.configs.recommended,
  {
    files: ["**/*.js"], 
    languageOptions: {
      globals: {
        ...globals.node,              // Node.js 글로벌 변수 추가
      },
      // ecmaVersion: "latest",          // 최신 ECMAScript 버전 사용
      ecmaVersion: 2021,              // 최신 ECMAScript 버전 사용
      // sourceType: "module",           // ES 모듈 시스템 사용
      sourceType: "commonjs",         // CommonJS 모듈 시스템 사용
    },
    rules: {
      "no-console": "off",            // console 로그 허용
      "no-undef": "error",            // 정의되지 않은 변수 에러 처리
      "no-unused-vars": "warn",       // 사용되지 않는 변수 경고
      "no-var": "error",              // var 사용 금지
      "prefer-const": "warn",         // const 사용 권장
      // "eqeqeq": ["warn", "always"],   // 일치 연산자 사용 권장
      // "semi": ["warn", "always"],    // 세미콜론 강제
      // "quotes": ["warn", "double"],  // 더블 쿼테이션 사용
      // "indent": ["warn", 2],         // 2칸 들여쓰기
      // "curly": "error",               // 중괄호 사용 강제
    },
  },
];

 

vscode 를 재시작하고 프로젝트를 다시 open 한다

 

vscode 에서 eslint 설정

 

vscode eslint 설정이 필요하면 수정한다

 

eslint rules

https://eslint.org/docs/latest/rules/

Rules Reference - ESLint - Pluggable JavaScript Linter