Vue bee

根据电商项目,抽出公共的组件

Version: 1.2.0 Updated: 12/23/2019

By: celverbamboo License: MIT

Downloads Last 30 Days: 10

Install

npm i vue-bee
yarn add vue-bee

Repository: https://github.com/celverbamboo/vue-bee

CDNs

bundle.run: https://bundle.run/vue-bee

jsDelivr: https://cdn.jsdelivr.net/npm/vue-bee

unpkg: https://unpkg.com/vue-bee

vue-bee

A fantastic mobile ui lib implement by Vue.

预览

A fantastic mobile ui lib implement by Vue

介绍本组件库的特点

  • 通过 vw 对 组件库的适配,核心CSS代码如下
    // stylus
    html
      font-size: 13.333333333333333vw 
    

px2rem($px, $rem = 100) @media (min-resolution: 2dppx) return ($px / $rem * 2) rem @media (min-resolution: 3dppx) return ($px / $rem * 3) rem

原理请查看这篇文章,[狠狠点击这里](https://celverbamboo.github.io/2018/06/20/Web/%E5%A6%82%E4%BD%95%E5%88%A9%E7%94%A8vw-rem%E8%BF%9B%E8%A1%8C%E7%A7%BB%E5%8A%A8%E7%AB%AF%E5%B8%83%E5%B1%80/)
### Install
```shell script
npm install vue-bee --save

Usage

import Vue from 'vue';
import VueBee from 'vue-bee';

Vue.use(VueBee);

Use modularized vue-bee

我们推荐在入口文件进, 例如在 src/main.js 行全局注册

import Vue from 'vue'
import {
  /* eslint-disable no-unused-vars */
  Style,
  Button,
  ActionSheet
} from 'vue-bee'

Vue.use(Button)
Vue.use(ActionSheet)

Tip: 局部引入的时候需要引入 Style 加载样式

For more information, please refer to [Quick Start](https://celverbamboo.github.io/vue-bee.github.io/docs/)

ToDo

  • More components
Categories: Vue js