vue 에서 Module not found: Error: Can't resolve 'axios' in 에러 원인

vue 실행 시 Module not found: Error: Can't resolve 'axios' in... 오류가 발생하는 원인에 대해 알아본다.

위 원인은 vue.js 프로젝트에서 axios 모듈을 찾을 수 없다는 의미로 볼 수 있다.

 

크게 3가지의 원인을 찾아볼 수 있다.

 

첫째, axios 가 설치되어 있지 않을 때

• axios 패키지가 프로젝트에 설치되지 않았을 때 발생할 수 있다.

둘째, 잘못된 설치 경로일때

• axios 가 프로젝트의 올바른 경로에 설치되지 않았거나, 설치 경로와 현재 프로젝트의 의존성 관리가 일치하지 않은 경우

셋째, 패키지 매니저 문제일 때

• npm 또는 yarn과 같은 패키지 매니저에서 설치 과정 중 문제가 발생했을 때.

위 원인에 대한 해결방법은 아래와 같다.

 

첫째, axios 가 설치여부 확인

• axios 프로젝트에서 package.json 파일의 dependencies 부분에 axios가 있는지 확인

package.json

둘째, axios 설치 또는 재설치한다.

• axios가 설치되지 않았다면 다음 명령어로 설치한다.

npm install axios

 

셋째, 캐시 문제

• 패키지 캐시가 문제를 일으킬 수 있으므로, 패키지 캐시를 삭제한 후 다시 설치한다.

npm cache clean --force
npm install

 

넷째, Vue 컴포넌트 파일이나 자바스크립트 파일에서 axios를 올바르게 임포트 했는지 체크

import axios from 'axios';

 

마무리

결론적으로 위 에러는 주로 axios가 설치되지 않았거나, 설치된 경로를 찾을 수 없을 때 발생한다.

위의 해결 방법을 적용해 axios를 설치하거나 재설치하면 문제를 해결할 수 있다.