My ESLint Note

10 Oct 2021

{
  "parserOptions": { // 1
    "ecmaVersion": 6, // 2 
    "sourceType": "module", // 3
    "ecmaFeatures": { // 4
      "jsx": true
    }
  }
  "env": { // 5
    "browser": true,
    "commonjs": true,
    "es2021": true,
    "node": true
  },
  "globals": { // 6
    "_": false
  },
  "plugins": ["import", "html"], // 7
  "extends": "airbnb-base", // 8
  "rules": { // 9
    "no-console": "warn", // 10
    "no-plusplus": "off", // 11
    "no-shadow": "off", // 12
    "vars-on-top": "off", // 13
    "no-underscore-dangle": "off", // 14
    "comma-dangle": "off", // 15
    "func-names": "off", // 16
    "prefer-template": "off", // 17
    "no-nested-ternary": "off", // 18
    "max-classes-per-file": "off", // 19
    "consistent-return": "off", // 20
    "no-restricted-syntax": ["off",  "ForOfStatement"], // 21
    "prefer-arrow-callback": "error", // 22
    "require-await": "error", // 23
    "arrow-parens": ["error", "as-needed"], // 24
    "no-param-reassign": ["error", { "props": false }], // 25
    "no-unused-expressions": ["error", {
      "allowTernary": true,     
      "allowShortCircuit": true,
      "allowTaggedTemplates": true
    }], // 26
    "import/no-extraneous-dependencies": ["error", { "devDependencies": true }], // 27
    "max-len": ["error", {
      "code": 110,
      "ignoreComments": true,
      "ignoreStrings": true,
      "ignoreTemplateLiterals": true
    }] // 28
  }
}

parserOptions
- ESLint 사용을 위해 지원하려는 자바스크립트 언어 옵션을 지정할 수 있음
ecmaVersion
- 사용할 ECMAScript 버전을 설정
sourceType
- parser의 export 형태를 설정
ECMAScript의 언어 확장 기능 설정
- globalReturn: 전역 스코프의 사용 여부 (node, commonjs 환경에서 최상위 스코프는 module)
- impliedStric: stric mode 사용 여부
- jsx: ECMAScript 규격의 JSX 사용 여부
env
- 설정 파일의 구체적인 환경 설정할때 쓰임
- 문서
globals
- 설정 파일에서 전역변수를 설정하기 위해 사용.
- 전역변수로 사용할 이름을 객체의 키로 설정하면 됨.
- 각각의 전역변수는 “writable”을 사용해 값을 덮어 씌우기를 허용하거나 “readonly”로 설정해 덮어 씌우기를 허용하지 않을 수 있음.
- globals는 문자열인 “off”를 사용해 비활성화 가능.
```
{
 "env": {
   "es6": true
 },
 "globals": {
   "Promise": "off"
 }
}
// 해당 설정에서는 Promise를 제외한 ES2015의 전역변수는 사용이 가능
```
- 예전에는 값이 false 혹은 “readable”이면 “readonly”. 반대로 true 혹은 writetable이면 “writable”이다. 하지만 이런식으로 설정하는것은 deprecated됨.
- 문서
plugins
- ESLint는 써드파티 플러그인 사용을 지원
- 플러그인 패키지를 설치하고, 해당 플러그인을 plugins에 추가하여 사용가능
- 플러그인 추가할때, eslint-plugin- 접두사는 생략이 가능
- 문서
extends
- 추가한 플러그인에서 사용할 규칙을 설정
- 플러그인을 추가하여도 규칙은 자동 적용되지 않기때문에 extends에서 설정해야함
- 문서
rules
- 프로젝트에서 사용하는 규칙을 수정
- 규칙을 수정하는 경우에는 아래와 같이 수정해야함 ```
- “off” 또는 0: 규칙을 사용하지 않음
- “warn” 또는 1: 규칙을 경고로 사용 -“error” 또는 2: 규칙을 오류로 사용 ```
- 규칙에 추가 옵션이 있는 경우에는 배열 구문을 사용해서 지정가능
- 플러그인에서 규칙을 지정할때 반드시 eslint-plugin-을 생략
no-console
- console 객체를 호출하거나 할당을 허용하지 않음
- 문서
no-plusplus
- 단항 연산자인 ++와 –의 호출을 허용하지 않음
- 문서
no-shadow
- 섀도우된 변수의 선언을 제거함
- 문서
vars-on-top
- 변수가 상위에 선언되어야함
- 문서
no-underscore-dangle
- 식별자에서 _의 사용을 방지함
- 문서
comma-dangle
- 객체나 배열 리터럴에 이어지는 , 사용을 강제함
- 문서
func-names
- 함수명의 사용을 강제 혹은 해제 할 수 있다.
- 문서
prefer-template
- 문자열과 함께 +의 사용을 설정
- 문서
no-nested-ternary
- 중첩된 삼항 연산자의 사용을 금지함
- 문서
max-classes-per-file
- 각각의 파일이 제한된 수의 클래스만 가질수 있도록 강제한다
- 문서
consistent-return
- return문이 항상 값을 반환하는지 하도록 혹은 하지 않도록 설정가능
- 문서
no-restricted-syntax
- 사용자가 정의한 구문을 허용하지 않음
- 문서
prefer-arrow-callback
- 화살표 함수로 전환이 가능한 함수를 발견하였을때 에러발생시킴
- 문서
require-await
- async 함수안에 await 표현식이 없을 경우 경고함
- 문서
arrow-parens
- 화살표 함수안에 매개 변수를 괄호로 감싸도록 강제함
- 문서
no-param-reassign
- 함수의 매개변수의 값을 수정하거나 다시 재할당 할 경우 발생할 수 있는 예상치 못한 행동을 방지함
- 문서
no-unused-expressions
- 프로그램 상태에 영향을 끼치지 않는 사용하지 않는 표현식을 제거
- 문서
import/no-extraneous-dependencies
- package.json’s dependencies, devDependencies, optionalDependencies, peerDependencies, or bundledDependencies에 선언되어있지 않은 외부 모듈의 import를 금지함
- 문서
max-len
- 코드의 가독성과 유지성을 위해 라인의 최대 길이를 강제함.
- 문서

참조

추후에 옵션들 더 추가할 예정…