vue cmd 창에서 axios / router 추가하여 새 프로젝트 생성하기

뷰의 새로운 프로젝트를 생성하기 위해 cmd 창이나 Visual Studio 의 Terminal 을 이용한다. 

처음에 cmd 창을 이용했는데 VScode 이용하는게 훨씬 편하다! 

 

더 자세하게 작성 된 vue 프로젝트 생성~~

Vue 프로젝트 생성 및 환경설정

1. node.js 설치. 패스등록
https://nodejs.org/ko/

2. workspace로 사용할 폴더 생성
ex>C:\Users\Playdata\Desktop\vue_projects

3. vscode에서 위 폴더 열기

4. vscode cmd(터미널)창에서 vue 설치
vue_projects>npm install vue

5. cmd창에서 vue-cli 설치
vue_projects>npm install -g @vue/cli
vue_projects>npm install --save axios
vue_projects>npm install --save vue-router
*이전 라우터삭제>npm uninstall vue-router

6. 기본프로젝트 생성
vue_projects>vue create vue_app1
버전2선택
Please pick a preset: Default ([Vue 2] babel, eslint)
$ cd vue_app1
$ npm run serve

6-1. axios와 router적용 프로젝트 생성
vue_projects>vue create vue_app2
메뉴에서 다음 선택
Manually select features
--
스페이스 바로 Router, Vuex *표시
Vue CLI v5.0.8
? Please pick a preset: Manually select features
? Check the features needed for your project: (Press  to select,  to toggle all,  to invert selection, and
 to proceed)
 (*) Babel
 ( ) TypeScript
 ( ) Progressive Web App (PWA) Support
 (*) Router
>(*) Vuex
 ( ) CSS Pre-processors
 (*) Linter / Formatter
 ( ) Unit Testing
 ( ) E2E Testing
---
Vue CLI v5.0.8
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, Router, Vuex, Linter
? Choose a version of Vue.js that you want to start the project with (Use arrow keys)
> 3.x
  2.x
---
Vue CLI v5.0.8
? Please pick a preset: Manually select features
? Check the features needed for your project: Babel, Router, Vuex, Linter
? Choose a version of Vue.js that you want to start the project with 3.x
? Use history mode for router? (Requires proper server setup for index fallback in production) (Y/n) y
---
> ESLint with error prevention only
  ESLint + Airbnb config
  ESLint + Standard config
  ESLint + Prettier
---
>(*) Lint on save
 ( ) Lint and fix on commit (requires Git)
---
  In dedicated config files
> In package.json
---
? Save this as a preset for future projects? (y/N) n

7. 프로젝트로 디렉토리 이동
vue_projects\vue_app1>npm run serve