# Vue CLi學習#1 安裝 Vue CLi

###### tags: `Vue cli`

## Vue CLi 簡單介紹

**Vue.js Command-Line Interface**，是由 Vue.js 核心團隊所開發，提供快速建立 Vue 專案環境，並整合套件開發的工具。

## Vue CLi 安裝

### STEP1: 安裝 [nvm](https://docs.microsoft.com/zh-tw/windows/dev-environment/javascript/nodejs-on-windows)

安裝 Vue CLi 需要先安裝 Node.js ， 但是 Node.js 每個人所用的版本都不一樣，而透過 nvm 可以快速切換不同版本的 Node.js，解決版本不一致的問題

### STEP2: 安裝 [Node.js](https://nodejs.org/en/)

繼續下載安裝 Node.js ， 目前安裝版本為 ` 14.19.0 `

` node -v ` ， 可以檢查目前版本

* nvm install [node 版本號] - 安裝特定版本的 nvm
* nvm list - 列出已安裝清單
* nvm use [node 版本號] - 切換到特定 Node 版本(只限有安裝的版本)

### STEP3: 安裝 Vue CLi

在安裝完 Node.js 之後，就可以使用 Node.js 預設的 [npm](https://zh.wikipedia.org/zh-tw/Npm) 套件來安裝 Vue CLi

#### 什麼是 npm

它是一個線上套件庫，可以下載各式各樣的 Javascript 套件來使用。

`npm -v` 檢查目前 npm 版本

#### npm 安裝 Vue CLi

`vue -V` 檢查版本 ，如果有出現 `@vue/cli 5.0.1` 就代表安裝成功

## 這樣就安裝完成了!!

## 參考

[Windows 10 安裝並使用 nvm 切換 NodeJS 版本](https://israynotarray.com/nodejs/20200107/3738078915/)
[從零開始: 使用NPM套件](https://medium.com/html-test/%E5%BE%9E%E9%9B%B6%E9%96%8B%E5%A7%8B-%E4%BD%BF%E7%94%A8npm%E5%A5%97%E4%BB%B6-317beefdf182)
[重新認識 Vue.js](https://book.vue.tw/CH3/3-1-vue-cli-introduction.html)