README_EN.md

English | 简体中文

bk-magic-vue

A UI library base on BlueKing Magicbox and Vue2

Install

$ npm install --save bk-magic-vue

Use

Import All

import bkMagicVue from 'bk-magic-vue'
import 'bk-magic-vue/dist/bk-magic-vue.min.css'
Vue.use(bkMagicVue)

Import necessary components

We need babel-plugin-import-bk-magic-vue to import necessary components.

first, install babel-plugin-import-bk-magic-vue

npm i babel-plugin-import-bk-magic-vue -D

then, you need to add the plugins configuration in the .babelrc file of the project.

// baseLibName is bk-magic-vue package name，the defaults is bk-magic-vue
{
    "presets": ...,
    "plugins": [
        ...
        ["import-bk-magic-vue", {
            "baseLibName": "bk-magic-vue"
        }]
    ]
}

after that, you can import necessary components like this

import { bkButton } from 'bk-magic-vue'
import { bkButton as cc } from 'bk-magic-vue'
import { bkButton, bkDropdownMenu } from 'bk-magic-vue'
import { bkButton as cc, bkDropdownMenu as dd } from 'bk-magic-vue'
console.log(bkButton)
console.log(cc)
console.log(bkDropdownMenu)
console.log(dd)

Develop

npm run dev

Build

npm run build