做這份筆記的時候,Vue.js還是1.0,10月份Vue已經升級到2.0,這邊也進行相應的更新,用Vue2.0進行一個簡單的環境搭建
餓了么也剛好開源了其基於Vue.js的UI框架element-ui傳送門
1. 環境搭建
由於辦公環境是在Windows下開發,所以還是選擇在Windows進行Vue.js的開發,使用NodeJS環境進行編譯,打包等
1.1 NodeJS及NPM安裝
1.1.1 NodeJS下載
在NodeJS官網中下載對應的NodeJS版本https://nodejs.org/en/
下載完成后進行安裝,NodeJS安裝完成后,對應的NPM也會安裝完成,安裝完成后需要設置NodeJS到環境變量中,在CMD命令行鍵入以下代碼,驗證NodeJS及NPM是否安裝正確 目前最新版本4.6.0對應npm版本2.15.9,可以手動升級到最新版本npm
> node -v
v4.6.0
> npm -v
v2.15.9
npm升級到最新版本的方法:
切換路徑到nodejs安裝目錄下(如:c:\program files\nodejs\),執行以下命令:
npm install npm@latest -g
1.1.2 安裝nrm
由於npm的鏡像資源在國外,訪問速度慢,可以使用npm安裝nrm,來管理npm的鏡像資源
> npm install -g nrm
使用nrm ls命令查看可用的資源

使用 nrm use ***選擇要使用的鏡像,如nrm use taobao

1.1.3 安裝打包工具webpack
使用
npm install -g webpack
安裝webpack

1.2 使用Vue的官方命令行工具搭建一個簡單的VueJS應用
1.2.1 安裝vue-cli
使用命令
npm install -g vue-cli
安裝Vue的官方命令行工具vue-cli

1.2.2 用vue-cli搭建一個基本的工程
使用以下命令,創建一個名為vue-test的前端項目
vue init webpack vue-test

此致環境的搭建基本完成
