vue問題:
論壇
http://bbs.zhinengshe.com
------------------------------------------------
UI元件
別人提供好一堆東西


目的: 
為了提高開發效率
功能


原則: 拿過來直接使用


vue-cli  ->  vue-loader


bootstrap:
twitter 開源
簡潔、大方
官網文件


基於 jquery


柵格化系統+響應式工具  (移動端、pad、pc)
按鈕
--------------------------------
bower前端包管理器   jquery#1.11.1
自動解決依賴
npmnode包管理器  [email protected]
--------------------------------


餓了麼團隊開源一個基於vue 元件庫
elementUI PC
MintUI 移動端
--------------------------------
elementUI:
如何使用


官網:http://element.eleme.io/
使用:
1. 安裝 element-ui
npm i element-ui -D


npm install element-ui --save-dev


//   i ->    install
//   D     ->    --save-dev
//   S ->    --save
2. 引入   main.js入口檔案
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-default/index.css'


全部引入
3. 使用元件
Vue.use(ElementUI)


css-loader   引入css
字型圖示file-loader




less:
less
less-loader
-------------------------------------------------
按需載入相應元件:√
就需要 按鈕
1. babel-plugin-component
cnpm install babel-plugin-component -D
2. .babelrc檔案裡面新增一個配置
 "plugins": [["component", [
   {
     "libraryName": "element-ui",
     "styleLibraryName": "theme-default"
   }
 ]]]
3. 想用哪個元件就用哪個
引入:
import {Button,Radio} from 'element-ui'
使用:
a). Vue.component(Button.name, Button);  個人不太喜歡
b). Vue.use(Button);   √
---------------------------------------------------
傳送請求:
vue-resourse 互動


axios
---------------------------------------------------
element-ui    ->  pc


mint-ui
移動端 ui庫


http://mint-ui.github.io/


1. 下載
npm install mint-ui -S


-S
--save
2. 引入
import Vue from 'vue';
import Mint from 'mint-ui';
import 'mint-ui/lib/style.css'
Vue.use(Mint);


按需引入:
import { Cell, Checklist } from 'minu-ui';
Vue.component(Cell.name, Cell);
Vue.component(Checklist.name, Checklist);


http://mint-ui.github.io/docs/#!/zh-cn2


論壇:

-------------------------------------------------------


Mint-ui-demo:  看著手冊走了一遍


https://github.com/itstrive/striveCode/tree/js/vue2.0-Mint-ui-demo