Bootstrap 天然响应式

12分栏
cnpm install bootstrap 安装相关包
在index.html中引入文件后才可以用
如下：
<link rel="stylesheet" href="node_modules/_bootstrap@3.3.7@bootstrap/dist/css/bootstrap.min.css">

ElementUI

24分栏
elementUI使用：

安装 element-ui
cnpm i element-ui -D 即
cnpm install element-ui --save-dev
// i -> install
// D -> --save-dev
// S -> --save
引入在main.js 入口文件

    import ElementUI from 'element-ui'
    import 'element-ui/lib/theme-default/index.css'

另外在webpack.config.js 中配置跟ElementUI相关组件的信息
{ test: /\.(eot|svg|ttf|woff|woff2)$/, /*配置ElementUI文件所需要的配置*/ loader: 'file-loader' },
3.引入使用全部 Vue.use(ElementUI)
4.实在不行的话直接去官网在index.html引入样式CDN
引入样式反正也是练手
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
引入组件库
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
标签以 <el> 开头

Mint-ui

移动端 ui库 http://mint-ui.github.io/

下载
npm install mint-ui -S
引入

    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

标签以<mt>开头