Frontend

Node, NPM 버전 업데이트 오류 해결

케키키케 2024. 5. 20. 22:03

버전 확인

node -v 

npm -v 

 

이 상태에서 vue 프로젝트를 생성하려고 하니 아래와 같은 오류가 발생한다.

 

>vue create test-board

You are using Node v10-, but this version of @vue/cli requires Node ^12.0.0 || >=14.0.0.

Please upgrade tour Node version.

 

Node 랑 NPM을 옛날 옛적 설치하고, 새로 뷰 를 설치했더니 버전들이 너무 낮나보다.

요래저래 검색해서 Node 버전과 NPM 버전을 올리기로 결심!

 

 

Node 버전 업데이트 시도

 

1차 시도 : npm install -g  

npm ERR! code EBADPLATFORM

npm ERR! notsup Unsupported platform ...

 

음..

 

2차 시도 : npm install npm@latest -g

npm WARN notsup Unsupported engine for npm@10-: wanted: {"node":"^18.17.0 || >=20.5.0"} (current: {"node":"10-","npm":"6.-"})
npm WARN notsup Not compatible with your version of node/npm: npm@10.-

npm ERR! code EEXIST
npm ERR! path ...
npm ERR! Refusing to delete... and not a link
npm ERR! File exists: ...
npm ERR! Remove the existing file and try again, or run npm
npm ERR! with --force to overwrite files recklessly.

npm ERR! A complete log of this run can be found in:
npm ERR!     ...debug.log

 

음.. 

 

 

NVM을 이용한 버전 관리

NVM(Node Version Manager)을 통해 노드 버전 관리가 가능하다.

현재 이전 프로젝트로 인해 과거 버전 유지가 필요하여, 혼란 방지를 위해 사용

 

> nvm list

   16.-
  * 10- (Currently using 64-bit executable)

 

> nvm use 16.-

높은 버전이 있어서

한번 설정해본다.

 

버전 다시 확인

npm -v 

node -v 

 

 

 

Vue 프로젝트 생성

vue도 최신 버전으로 다시 설치해본다.

> npm install -g @vue/cli

 

프로젝트 생성

>vue create testboard

https://onethejay.tistory.com/58

 

[Vue] Vue.js 게시판 만들기 1 - Frontend 프로젝트 생성

요즘 Frontend에서 핫한 React와 Vue.js 중 Vue.js로 게시판을 만들어봅시다. Front와 Back은 별도의 프로젝트로 구분하여 작업을 진행합니다. Node, Npm, Vue Cli 설치 자기의 OS에 맞게 Node.js을 설치하고 버전

onethejay.tistory.com

* yarn/npm 빌드 비교

https://joshua1988.github.io/vue-camp/package-manager/npm-vs-yarn.html#npm%E1%84%80%E1%85%AA-yarn%E1%84%8B%E1%85%B4-%E1%84%8E%E1%85%A1%E1%84%8B%E1%85%B5%E1%84%8C%E1%85%A5%E1%86%B7

 

 

프로젝트 실행

프로젝트로 이동해서 한번 실행해보자.

> cd vue-testboard

> yarn serve

오류 없이 실행되었다면 접속해보자

 

localhost:8080

vue 기본 화면이 보일 것이다.

 

아래와 같은 메시지가 나온다.

  Note that the development build is not optimized.
  To create a production build, run yarn build.

 

run yarn build로 최적화가 가능하다.