vue 프로젝트를 만드니 저런 에러가 떴다.
우선 에러의 의미를 직역하자면 "babel.config.js 파일을 찾지 못해"라는 것이다.
근데 루트 경로에 분명히 babel.config.js가 있다.
원인은 다음과 같다.
vue-eslint-parser 파서에 의해 발생. App.vue가 Babel에 처리하는 형식으로 변환되지 않아서 발생함.
Babel : 최신 문법을 이전 버전의 브라우저에서도 동작할 수 있는 버전의 자바스크립트 코드로 변환해주는 도구
ESLint : 자바스크립트 코드에서 잠재적인 오류를 찾고, 일관된 코딩 스타일을 유지하기 위한 정적 코드 분석 도구
주로 나와있는 해결 방법은 두 개다.
1) .eslintrc.js
다음 이미지로 예시를 들면서 설명하겠다.
프로젝트에 .js 파일을 새로 생성하고 오른쪽 코드를 적어주면 된다.
2) settings.json
위의 .eslintrc.js의 경우는 그냥 프로젝트에 [ New File ]을 하면 됐지만 settings.json의 경우는
Command Palette 를 이용해서 생성해야 한다.
생성하고 난 후 모습은 다음과 같다.
근데 경로를 보면 C:\Users\[ 사용자 컴퓨터 ]\AppData\Roaming\Code\User 이렇게 나와있다.
그 이유는 Visual Studio Code에서 공통적으로 사용하기 위한 설정이기 때문이다.
즉 새로운 프로젝트를 만들어도 적용되는 사항이므로 필자의 경우는 Setting.json을 만들었다.
