Eslint 초기 설정하기

Eslint

Eslint는 코드를 분석하여 에러를 찾아주고 일관적인 코딩 스타일로 작성할 수 있게 도와줍니다.

다른사람의 설정을 가져와서 사용할 수도 있고 외부에 공개되어있는 기업들의 설정을 가져와서 사용할 수도 있습니다.

2017년 에는 네이버에서도 Eslit 규칙을 공개 하기도 했습니다.

Airbnb

airbnb/javascript

Google  

google/eslint-config-google

How To Start ?

Eslint 설치

Npm

npm install eslint

Yarn

yarn add eslint

해당 프로젝트 폴더에서 터미널 열고 셋업

eslint --init

 

 

How would you like to configure ESLint? 하며 설정을 물어봅니다.

본인의 프로젝트에 맞는 설정을 하시면 되며 (React ,Vue ..)  어떤 가이드를 선택 하냐 에서

airbnb나 스탠다드 구글이 나오는데 보통 airbnb로 가이드를 많이 따릅니다.

- 설정이 끝나면 .eslintrc.js 파일이 생기며 아래와 같이 초기 설정이 완료가 됩니다.

- Rules 에는 규칙을 설정할 수 있습니다. 

module.exports = {
  env: {
    browser: true,
    es2021: true,
  },
  extends: [
    'plugin:react/recommended',
    'airbnb',
  ],
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 12,
    sourceType: 'module',
  },
  plugins: [
    'react',
  ],
  rules: {
      // 규칙을 설정할 수 있음.
  },
};