Develop Dairy/JavaScript, React

ESLint 무언가 틀린게있으면 가르쳐주는 친구

평생코딩 2019. 3. 19. 04:59

ESLint를 비쥬얼스튜디오에서 설치해보자




1. 만약에 npm으로 eslint 를 글로벌로 설치했었다면 지워보자


$ npm uninstall eslint -g



2. vscode에서 ESlint extension를 설치하자


3. 수동의 3개의 패키지를 설치한다.(eslint-config-airbnb-base, eslint, eslint-plugin-import) 3개의 패키지

$ npm add eslint-config-airbnb-base eslint eslint-plugin-import


4. .eslintrc.js 파일을 만들고 다음과 같이 복사한다


module.exports = {

  env: {

    browser: true,

    es6: true,

    node: true

  },

  extends: "airbnb-base",

  globals: {

    Atomics: "readonly",

    SharedArrayBuffer: "readonly"

  },

  parserOptions: {

    ecmaVersion: 2018,

    sourceType: "module"

  },

  rules: {}

};


5. eslint-config-prettier를 설치

npm install eslint-config-prettier


6. .eslintrc.js 파일에서 extends 부분에 "airbnb-base", 부분을 ["airbnb-base", "prettier"], 이렇게바꿔주자



7. [Ctrl + S ] 한 후 적용되어 빨간색으로 밑줄쳐진 선들이 보일것이다.