一、概述

本篇僅僅是安裝vue及集成elementUI，不做過多深入
還主要記錄下代理環(huán)境下使用npm
流程：

• 安裝nodejs（略過）
• 安裝npm(nodejs自帶，略過)
• 設(shè)置代理(可選)
• 安裝cnpm
• 安裝vue
• 安裝vue-cli3.x
• 新建vue項(xiàng)目
• 安裝element-ui
  參考鏈接：
  http://www.itdecent.cn/p/96d7558e643b

二、代理設(shè)置（可選）

公司使用代理上網(wǎng)，需要設(shè)置npm代理，如果不使用代理，此步驟略過
設(shè)置代理：

npm config set proxy http://proxyIp:port
npm config set https-proxy http://proxyIp:port
// 如果使用了cnpm 則需要執(zhí)行
cnpm config set proxy http://proxyIp:port
cnpm config set https-proxy http://proxyIp:port
// 取消代理
npm config delete proxy
npm config delete https-proxy
// 如果使用了cnpm代理
cnpm config delete proxy
cnpm config delete https-proxy

三、安裝cnpm

npm下載不是一般的慢，建議切換到cnpm國內(nèi)鏡像
其實(shí)就是切換了registry地址（淘寶鏡像），有兩種方式，一種方式是直接切換npm的registry地址，另一種是使用cnpm，它感覺就是npm套了個(gè)馬甲，更換了內(nèi)部的regisrty

• 更換npm registry

// 臨時(shí)切換
npm --registry https://registry.npm.taobao.org install express
// 永久切換
// 就算使用cnpm，這個(gè)最好也設(shè)置下，因?yàn)関ue項(xiàng)目create的時(shí)候用的還是這個(gè)
npm config set registry https://registry.npm.taobao.org

切換成功后，可以執(zhí)行下面的命令查看下registry的地址

npm config get registry
// 或者查看詳細(xì)信息
npm info express

• 使用cnpm

npm install -g cnpm --registry=https://registry.npm.taobao.org
// 查看配置
cnpm install express

四、安裝vue（全局安裝）

cnpm install -g vue

五、安裝vue-cli3.x

vue-cli3.x的安裝與2.x的安裝命令略有區(qū)別

cnpm install -g @vue/cli

六、新建vue項(xiàng)目

vue create 項(xiàng)目名稱

按照提示一步一步來就可以，模塊選擇那，空格是選擇，回車是下一步

七、安裝element-ui

進(jìn)入到新建項(xiàng)目的根目錄執(zhí)行：

cnpm i element-ui -S

會(huì)自動(dòng)安裝到項(xiàng)目的node_modules目錄下，然后就可以愉快地使用element-ui了

八、總結(jié)

萬事開頭難，環(huán)境搭起來，剩下的就是學(xué)習(xí)具體的模塊了~