win7安裝VUE2

一、安裝node.js
node.js是一個平臺，封裝了chorme v8的引擎，可以直接用js作爲服務器端腳本語言。http://nodejs.cn/進去該網站下載最新版本
安裝完成後，wind+r  彈出cmd，輸入node -v 和 npm -v  分別查看版本號，代表node.js安裝完成。
 二、node.js的環境變量的新建。
    其實安裝完node，就自動在path裏增加環境變量，但是爲了以後的本地部署項目，我們需要找到node.js的安裝根目錄，在當中新建“node_global”和"node_cache"兩個文件夾。
1、啓動CMD依次執行以下兩條命令
    npm config set prefix "F:\set-soft\nodejs\node_global"
    npm config set cache "F:\set-soft\nodejs\node_cache"


2、設置環境變量：
    NODE_PATH = F:\set-soft\Node\nodejs
    PATH = %NODE_PATH%\;%NODE_PATH%\node_modules;%NODE_PATH%\node_global;
這樣就可以把後面全局安裝的裝到global裏並且可以直接用命令使用。


三、安裝淘寶的npm鏡像：


由於有些npm有些資源被屏蔽或者是國外資源的原因，經常會導致用npm安裝依賴包的時候失敗，所有我還需要npm的國內鏡像---cnpm ，安裝之後就可以用cnpm代替npm


Cmd命令行中輸入npm install -g cnpm --registry=http://registry.npm.taobao.org


可能報錯一：
安裝cnpm報錯network連接不上 ， 錯誤信息如下
npm ERR! code ETIMEDOUT
npm ERR! errno ETIMEDOUT
npm ERR! network request to http://registry.npm.taobao.org/cnpm failed, reason:
connect ETIMEDOUT 114.55.80.225:80
npm ERR! network This is a problem related to network connectivity.


如果你用到代理，cmd安裝需要設置代理
npm config set https-proxy http://proxy.zte.com.cn:80
npm config set proxy http://proxy.zte.com.cn:80


npm set registry http://registry.npm.taobao.org
npm install -g cnpm --registry=https://registry.npm.taobao.org


可能報錯二：
ERR! stack Error: Can't find Python executable "python", you can set the PYT
H
HON env variable.
缺少Python環境
安裝python解決，python(v2.7 recommended, v3.x.x is not supported) 
下載：http://www.python.org/ftp/python/2.7.3/python-2.7.3.msi 


確認是否安裝成功，cmd命令數據cnpm -v 出來一大堆東西。如果報命令符不存在可能是
環境變量path沒有配置，找到cnpm.cmd 的位置，配置path 


四、安裝vue-cli腳手架構建工具
vue-cli是vue官方提供的一個命令行工具，可用於快速搭建大型單頁應用。該工具提供開箱即用的構建工具配置，帶來現代化的前端開發流程。只需一分鐘即可啓動帶熱重載、保存時靜態檢查以及可用於生產環境的構建配置的項目。


安裝命令爲：cnpm install -g vue-cli，回車，等待安裝
可能報錯一：
Error: connect ETIMEDOUT 114.55.80.225:443
如果你用到代理，cmd安裝需要設置代理
cnpm config set https-proxy http://proxy.zte.com.cn:80
cnpm config set proxy http://proxy.zte.com.cn:80


安裝完後，檢查是否安裝成功，輸入vue，出現以下提示表示安裝成功。


五、試試新建一個Vue項目


1、新建一個項目文件夾，命名爲 vue-demo，cd到此文件夾，
2、輸入:vue init webpack vue-demo，回車，


按照如下操作進行初始化：webpack是構建工具、模塊打包器，也就是整個項目是基於webpack的。
期間會卡住不動，
需要你輸入安裝過程中，需要我們輸入項目名稱，描述，作者，版本（獨立版）,使用ESLint規範等等，
按enter鍵或者輸入y確認等等
之後開始自動生成目錄
3、安裝項目依賴的包
cd到vue-demo 文件夾，執行cnmp install，安裝依賴包，安裝完成之後，項目目錄下多了node_modules：
4、運行項目
在命令行裏輸入 cnpm run dev，執行完成後啓動項目，瀏覽器輸入localhost:8080出現以下接結果，說明啓動成功。注意瀏覽器的版本，低版本的不支持哦。