[Error] Parsing error: ESLint was configured to run on `<tsconfigRootDir>/.eslintrc.js` using `parserOptions.project`

 

 

error Parsing error: ESLint was configured to run on `<tsconfigRootDir>/.eslintrc.js` using `parserOptions.project`: ~

However, that TSConfig does not include this file. Either: - Change ESLint's list of included files to not include this file - Change that TSConfig to include this file - Create a new TSConfig that includes this file and include it in your parserOptions.project See the typescript-eslint docs for more info: https://typescript-eslint.io/linting/troubleshooting#i-get-errors-telling-me-eslint-was-configured-to-run--however-that-tsconfig-does-not--none-of-those-tsconfigs-include-this-file

해당 에러는 주로 타입스크립트와 ESLint를 같이 사용할 때 설정을 제대로 하지 않아 발생할 수 있습니다.

 

현재 `.eslint.js` 예시 입니다. 기본으로 이정도 설정이 되어있다고 가정합니다.
각각 옵션에 대한 설명 (링크)

module.exports = {
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
  ],
  plugins: ['@typescript-eslint'],
  parser: '@typescript-eslint/parser',
  parserOptions: {
    project: true,
  },
  root: true,
};

 

 

 

 

해결법 

1. `.eslintignore` 파일에  `.eslintrc.js` 을 추가

또는 `.eslintrc.js`에  `ignorePatterns`를 사용해서 오류를 방지할 수 있다.  

예시

module.exports = {
  env: {
    node: true,
    es2021: true,
    jest: true,
  },
  extends: ['eslint:recommended', 'prettier'],
  rules: {
 	// ...
  },
  ignorePatterns: ['.eslintrc.js'],
};

 

 

2. TSConfig에 `.eslintrc.js` 포함시키기  (비추천)

`.eslintrc.js` 파일을 굳이  parser할 필요가 없다.  

{
  "compilerOptions": {
	// ...
  },
  "include" : ['eslintrc.js', '**/*']
}

 

 

3. 파일 포멧 변경

`.eslintrc.js` 대신 아래 처럼 변경하면 에러가 해결된다.

• .eslintrc.yaml
• .eslintrc.yml
• .eslintrc.json  ( = .eslintrc)

❗️ .eslintrc.json 의 단점

1. JSON에는 주석을 추가할 수 없습니다. 
    - JSON5 통해 지원되지만 이는 외부 종속성으로 설치해야합니다.  
2. JSdoc을 사용할 수 없습니다.  
3. JSON에는 로직을 내장시킬 수 없습니다. 
  - JS에서는 .editorconfig와 package.json과 같은 파일을 감지하거나 구문 분석할 수 있는 몇가지 작업을 수행할 수 있습니다.       이렇게 함으로써 필요한 eslint 플러그인 수를 줄일 수 있습니다.  

 

 

 

잘못된 해결법

혹시 또 다른 방법이 있나 찾아보다가 이상한 설정을 발견하였다.  

1. `eslintrc.js` 를 `eslintrc.ts`로 확장자 변경

이렇게 당장의 에러가 사라져서 마치 에러가 해결된 것 처럼 보입니다. 

하지만 이렇게 하면 단순한 타입스크립트 파일이 되기 때문에 여러분들이 열심히 설정한 `ESLint Configuration File`이 아무쓸모 없게됩니다.  

eslint는 .ts 확장자를 지원하지 않습니다. 

eslint가 지원하는 파일 포멧

 

 

 

 

---

References

https://typescript-eslint.io/getting-started/

https://eslint.org/docs/latest/use/configure/configuration-files

https://www.reddit.com/r/typescript/comments/x6z9xv/eslintrcjs_to_eslintrcts/

https://typescript-eslint.io/linting/troubleshooting/#i-get-errors-telling-me-eslint-was-configured-to-run--however-that-tsconfig-does-not--none-of-those-tsconfigs-include-this-file