@zhousheng193/big-aa-ui v1.0.0

@bes/b-ui 组件库

快速开始

1.安装

npm i @bes/b-ui

2.引用组件库

全部引入

import BUI from '@bes/b-ui'
import '@bes/b-ui/lib/index/index.css'
Vue.use(BUI)

按需引入

借助 babel-plugin-component，我们可以只引入需要的组件，以达到减小项目体积的目的。 在你的项目中加入babel-plugin-component依赖，执行如下脚本

npm install babel-plugin-component -D

在babel.config.js 或者.babelrc中添加如下脚本

  plugins: [
    [
      'component', // 按需导入组件
      {
        'libraryName': '@bes/b-ui', // UI组件库名称
        'libDir': 'lib/packages', // 包路径，默认lib
        'root': 'index', // 主文件目录，默认index
        'camel2Dash': true, // 是否将名称解析为破折号模式，默认true
        'style': true// 从 'style.css' 导入 js 和 css
      }
    ]
  ]

1. 按需引用并全局注册，比如在main.js中

import Vue from 'vue'
// 按需加载自定义组件并全局注册
import {
  BButton,
  BIcon,
  BElCascader,
  BElCascaderPanel
} from '@bes/b-ui'
// 全局注册
Vue.use(BButton)
Vue.use(BIcon)
Vue.use(BElCascader)
Vue.use(BElCascaderPanel)

2. 按需引用并在使用页面注册,比如在test.vue页面

   import { BElCascader } from '@bes/b-ui'
   export default {
    components: {
      BElCascader
    },
    ...
   }