vue安裝及使用

vue中文網站：https://cn.vuejs.org/v2/guide/installation.html  包含了安裝、使用、api、視頻。

一. 什么是 Vue

　　Vue 是一個前端框架，特點是
　　　　數據綁:　比如你改變一個輸入框 Input 標簽的值，會自動同步更新到頁面上其他綁定該輸入框的組件的值

 

　  　　 組件化: 　頁面上小到一個按鈕都可以是一個單獨的文件.vue，這些小組件直接可以像樂高積木一樣通過互相引用而組裝起來

 

　　下載vue.js

開發或學習：<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

生產環境：<script src="https://cdn.jsdelivr.net/npm/vue@2.6.0"></script>

二. vue安裝步驟

　　 1.  安裝node.js。

　　　　    官網下載地址：https://nodejs.org/en/download/  

　　　　　檢測PATH環境變量是否配置了Node.js，“windows+r” 快捷鍵  輸入"cmd" => 輸入命令：path，輸出如下結果（ctrl+f 在當前頁面搜索 通用）：　　

  　　　　　　 PATH=C:\Program Files\nodejs\; 　　　　　　　　C:\Users\rg\AppData\Roaming\npm
　　　　　說明安裝成功
　　　　　檢查Node.js版本：node-v　　　　　npm包管理器是集成在Node.js中　　　　　　　　　　
　　　　　查看npm的版本命令：npm -v

     　　　　

　　　　　　（7）輸入命令npm -g install npm，更新npm至最新版本

　　　　　　　　查看版本   npm -v  

　　2.安裝公服-淘寶鏡像（cnpm）

　　　使用淘寶 NPM 鏡像。cnpm 命令代替默認的npm命令，增加依賴包加載速度且避免資源限制。 

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

　　3.安裝webpack

　　　　cnpm install webpack -g

　　4.安裝vue腳手架

　　　　npm install vue-cli -g
　　　（安裝失敗的解決方法 npm cache clean --force）

　　　　會有一些初始化的設置，如下輸入:
　　　　Target directory exists. Continue? (Y/n)直接回車默認(然后會下載 vue2.0模板，這里可能需要連代理)
　　　　Project name (vue-test)直接回車默認
　　　　Project description (A Vue.js project) 直接回車默認
　　　　Author 寫你自己的名字

　　5.安裝 vue 路由模塊vue-router和網絡請求模塊vue-resource

　　　　cnpm install vue-router vue-resource --save

　　　啟動項目

　　　　npm run dev