프론트엔드 개발환경의 이해와 실습 - ESLint

Gisele·2021년 7월 8일
0

ESLint

소스 코드를 분석하여 프로그램 오류, 버그, 스타일 오류, 의심스러운 구조체에 표시(flag)를 달아놓기 위한 도구들을 가리킨다 - 위키백과(린트)

  • 린트는 코드의 가독성을 높인다.
  • 동적 언어의 특성인 런타임 버그를 예방하는 역할을 한다.

ESLint는 ECMAScript 코드에서 문제점을 검사하고 더 나은 코드로 정정하는 린트 도구 중 하나다. 코드의 가독성을 높이고 잠재적인 오류와 버그를 제거해 단단한 코드를 만드는 것이 목적이다.

  • 포맷팅 : 일관된 코드 스타일을 유지해 가독성을 높인다 - 들여쓰기 규칙, 코드 라인의 최대 너비 규칙
  • 코드품질 : 어플리케이션의 잠재적인 오류나 버그를 예방 - 사용하지 않는 변수 쓰지 않기, 글로벌 스코프 함부로 다루지 않기

설치 및 사용법

  • 설치
  • 설정파일 : .eslintrc.js
  • rules : eslint Rules
  • Extensible Config : 규직을 미리 정해 놓은 것. extends 설정에 추가해서 사용한다. ex] eslint - recommended, airbnb, standard
$ npm i -D eslint

.eslintrc.js

module.exports = {
  extends: ['eslint:recommended']
  // rules:{
  //     "no-unexpected-nultiline:"error"
  // }
};

eslint init

$ npx eslint --init


eslint --init을 하면 설정할 수 있음.
설정이 완료되면 .exlintrc.js가 아래와 같이 덮어써짐


📑 reference

profile
한약은 거들뿐

0개의 댓글