[VueJS] Intellij 에 개발 환경 설정

Web 개발을 위해 요즘 VueJS를 많이 사용하고 있다. 

 

Intellij에 VueJS의 환경설정을 적용하고자 한다. 

NodeJS 및 VueJS 설치 

 

Intellij의 plugins 에서 Marketplace를 통해 다음 3개는 필수로 설치해 주어야 한다

1. NodeJS
2. VueJS
3. EJS

 

다음 Terminal를 통해서 정상적으로 설치가 되었는지 확인해주면 된다.

 

node 버전 확인 
   : node --version 

vue 버전 확인 
   : vue --version

 

NPM 설치

다음은 Node Package Manager 를 설치해야 한다.  intellij의 Terminal를 통해 실행한다. 

 

npm install -g @vue/cli

설치가 완료 되면, vue 프로젝트를 생성한다. 

vue create [프로젝트 디렉토리명]

#예제
vue create vueTestProject

 

프로젝트 디렉토리가 생성되면 npm 서버를 시작한다. 

 

cd [프로젝트 디렉토리]
npm run [package.json 에 정의된 script 명]

#예제
cd vueTestProject
npm run serve

 

성공 시 위와 같은 로그가 나온다. 

Local에 표시된 url를 클릭하면 welcome 페이지가 뜬다. 

 

끝!