겪었던 Eslint, prettier 에러

에디터에서 eslint, prettier 적용문제 (에러 표시, 자동 설정 등)

• Eslint, prettier 확장 툴 설치 되어있는지 확인
• VSC 또는 웹스톰 등 에디터에서 설정이 되어있는 확인
• 또는 eslintrc, prettier 설정 파일에 오타가 없는지 확인

 

Parsing Error: No babel config file detected for 경로

1. eslint 설정파일에서 "parser": "@babel/eslint-parser" "parserOptions" : { requireConfigFile: false, } 추가 

"parser": "@babel/eslint-parser",
"parserOptions": {
    "ecmaVersion": 2020,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    },
    "requireConfigFile": false // 이 부분 추가
  },

 

Parsing Error: This experimental syntax requires enabling one of the following parser plugin(s): "jsx", "flow", "typescript"

1. eslint 설정 파일에서 "extends": { "react-app" } 추가 
2. 또는 @babel/preset-react 를 설치( npm i -D @babel/preset-react or yarn add -D @babel/preset-react)
3. eslint 설정 파일에서 "babelOptions": { "preset":  ["@babel/preset-react"] }, 를 추가

"babelOptions": {
    "presets": ["@babel/preset-react"] 
  },  
  
  // 위 항목을 추가해준다.