@jihyunlab/eslint-config

ESLint는 자바스크립트와 타입스크립트 코드의 문제 되는 패턴을 식별하는 정적 코드 분석 도구입니다.
@jihyunlab/eslint-config는 타입스크립트를 위한 ESLint 설정을 제공합니다.

설치

프로젝트 폴더에서 @jihyunlab/eslint-config를 설치합니다.

npm i --save-dev @jihyunlab/eslint-config

---

설정

.eslintrc.* 파일이 존재하는 경우 .eslintrc.json 파일로 변경하고 수정합니다.

├  .eslintrc.json
└  ...

"extends": [
  "@jihyunlab/eslint-config"
]
"parserOptions": [
  "project": "./tsconfig.json"
]

.eslintignore 파일을 생성하고 수정합니다.

├  .eslintignore
└  ...

/node_modules
/build
/dist

.vscode/extensions.json 파일을 생성하고 수정합니다.

├  .vscode
│  └  extensions.json
└ ...

{
  "recommendations": [
    "dbaeumer.vscode-eslint"
  ]
}

---

VSCode 플러그인 설치

VSCode 사용시 확장 탭에서 ESLint 플러그인을 설치합니다.

---

문제 해결

Peer dependencies 패키지가 설치 되지 않음

yarn으로 설치 할 경우 발생하는 문제이며 모든 패키지를 별도로 설치하거나 npm으로 설치를 진행합니다.

npm i --save-dev eslint@^8.34.0 @typescript-eslint/eslint-plugin@^5.52.0 @typescript-eslint/parser@^5.52.0 eslint-config-prettier@^8.6.0

ESLint와 Prettier 간의 충돌

ESLint의 Prettier 관련 구성이 적용되지 않도록 .eslintrc.json 파일을 수정합니다.

├  .eslintrc.json
└  ...

"extends": [
  "@jihyunlab/eslint-config",
+ "prettier"
]

실행시 오류가 발생

"The file must be included in at least one of the projects provided"

tsconfig.eslint.json 파일을 생성하고 수정합니다.

├  tsconfig.eslint.json
└  ...

{
  "extends": "./tsconfig.json",
  "include": ["src/**/*.ts", "src/**/*.js", "test/**/*.ts"]
}

.eslintrc.json 파일을 수정합니다.

├  .eslintrc.json
└  ...

"parserOptions": [
- "project": "./tsconfig.json"
+ "project": "./tsconfig.eslint.json"
]

다른 타입스크립트 ESLint 오류에 대해서는 다음 링크를 확인하세요.

https://typescript-eslint.io/linting/troubleshooting/

적용을 원하지 않는 파일이 존재

.eslintignore 파일을 수정합니다.

├  .eslintignore
└  ...

# markdown
*.md
*.mdx

---

라이센스

Open source licensed as MIT.