반응형

📢NODE JS -ESlint

 

📋ESlint 설치법

 

▼ESLint

ESLint는 자바스크립트 문법 중 에러가 있는 곳에 표시를 달아놓는 도구를 의미합니다.ESLint가 뜬 이유는 바로 확장성 때문입니다. 다양한 플러그인을 사용할 수 있기 때문에 새로운 규칙을 추가할 수 있고, 손쉽게 다른 회사나 사람의 설정을 도입할 수 있습니다.

npm install eslint
eslint --init
// 또는
node node_modules\eslint\bin\eslint.js --init

////////////아래 질의문 선택////////////////////
? How would you like to use ESLint? 
To check syntax, find problems, and enforce code style

? What type of modules does your project use? 
JavaScript modules (import/export)

? Which framework does your project use? 
None of these

? Where does your code run? (Press  to select,  to toggle all,  to invert selection)
Browser

? How would you like to define a style for your project? 
Use a popular style guide

? Which style guide do you want to follow? 
Airbnb (https://github.com/airbnb/javascript)

? What format do you want your config file to be in? 
JavaScript

? Would you like to install them now with npm? 
Yes

Window 에선 위와같이 떠서 이렇게 설치했다 (Window 7 OS 기준)

설치가 정상 완료되면 Package.json 에

  "devDependencies": {
    "eslint": "^5.16.0",
    "eslint-config-airbnb-base": "^13.1.0",
    "eslint-plugin-import": "^2.16.0",
    "nodemon": "^1.18.10"
  },

//이렇게 추가가 되어있을것이다

그리고 또한 .eslintrc.js 파일도 생겻을 것이다.

▼ 삭제방법

npm uninstall eslint

▼ prettier 설치방법

npm install eslint-plugin-prettier
npm install eslint-config-prettier

package.json 에서  dependencies 에 
"eslint-plugin-prettier" : "^3.0.0", 이런게 잇을텐데
이걸 devDependencies객체로 넣자 그후 npm install prettier -D
이렇게 명령어를 쳐서 설치하면 된다.

▼ 문법에러 안뜨게하기 (몇몇 에러들은 코딩스타일인데 걸리는이유가 있다.)

.eslintrc.js
module.exports = {
  extends: ["airbnb-base", "plugin:prettier/recommended"],
  rules: {
    "no-console": "off"
 }
};
//이렇게 에러의 이름이있는데 rules 에 에러이름을넣고 off를 넣어주면된다.

 

 

반응형

+ Recent posts