[맥북m2] 리액트 npm 프로젝트 생성 오류 ERR! 2가지 해결 방법

🎲 문제 상황

vs code를 통해 react를 설치하려고 했는데 에러가 '우수수' 쏟아졌다.

모두 동일하게

npm ERR! code EEIST

npm ERR! syscall mkdir 등등이 떴다

일주일 내내 react를 설치하려고 구글링을 해서, 해결 방법 두가지를 찾았다

 

🎲 해결 방법

1. npm modules 삭제가 가능할 때

npm install EEXIST: file already exists 에러가 날때 사용할 수도 있는 방법이다

 

1-1 node_modules 삭제

 

비주얼 스튜디오 왼쪽에 있는 node_modules 를 삭제(delete)해준다

 

 

1-2 npm 재설치

아래 코드로 npm을 재설치 해준다

npm install 
npm audit fix

 

 끝!!!! 이면 좋겠지만,,,

 

 

 

 

 

 

 

나의 경우 node_modules가 생성 조차 안 되었기 때문에, 삭제도 하지 못 했다.

그래서 에러가 우수수 떨어지느 화면을 또 만나게 되었다

 

이러면, 두번째 해결 방법을 사용한다

 

2. node modules가 없어서 삭제가 불가능 할 때

2-1 node.js 를 완전히 삭제한다

터미널에 아래 코드를 모두 한번에 복사한 뒤 엔터를 친다.

sudo rm -rf /usr/local/lib/node
sudo rm -rf /usr/local/lib/node_modules
sudo rm /usr/local/lib/dtrace/node.d
sudo rm /usr/local/share/man/man1/node.1
sudo rm -rf /usr/local/share/doc/node
sudo rm -rf /usr/local/share/systemtap/tapset/node.stp
sudo rm -rf /usr/local/include/node
sudo rm /usr/local/bin/node
sudo rm /usr/local/bin/npm
sudo rm /usr/local/bin/npx

brew를 통해 node를 설치했다면, 아래 코드도 추가로 입력해준다.

brew uninstall node
brew doctor
brew cleanup

계속 오류가 난 다면 아래 코드도 추가로 입력해준다.

sudo rm -rf /Users/$USER/.npm
sudo rm -rf ~/.npm

 

 

2-2 node, npm 제거 확인

node -v		//node 버전 확인 코드
npm -v		//npm 버전 확인 코드

 

각각 command not found: node , No such file or directory 

라고 나오면 완전히 삭제가 된 것이다.

 

 

2-3 node 재설치

그리고 node 홈페이지에 가서  node.js를 새로 설치한다

https://nodejs.org/en

 

주의!

여기서 왼쪽에 있는 LTS 버전으로 재설치를 한다

 

 

그리고 VS Code 터미널에서 -bash 로 설정한 뒤 아래 코드를 복붙한다

npx create-react-app blog

여기서 blog 말고 자기가 원하는 파일 명을 지정해 줄 수 있다. ex) npx create-react-app folder

그러면 아래와 같이 ERR! 이 아닌, 정상 실행되는 화면을 볼 수 있다.

 

 

 node_modules 도 생성되었다!

 

 

리액트 화면 실행하기

앞으로 리액트 프로젝트를 만들때 이렇게 해주자

VS Code 터미널에 'cd 디렉토리 명' 을 입력한다

 

디렉토리는 node_modules가 있는 상위 폴더 명이다

아까 우리는 npx create-react-app blog 라는 명령어로 blog라는 이름의 폴더를 생성했다.

cd blog //blog 말고 본인이 정한 폴더 명을 입력한다

 

그런다음

npm start

를 입력한다

 

그러면 위와 같이 성공했다는 문구와 함께 아래 react 화면이 뜬다

 

이제 모든것이 완벽하니 즐겁게 코딩을 하자~

 

 

 

클라이스의 개발 일지입니다
@clice @clicelee