快速上手

安装

npm i @d7ee/z-base-ui

注册

提供如下三种形式的注册方式：

全局注册

在 main.ts 或 main.js 中进行全局注册，值得注意的是，样式文件需要单独引入。

import { createApp } from 'vue'
import App from './App.vue'
import ZBaseUi from "@d7ee/z-base-ui";
import "@d7ee/z-base-ui/dist/index.css"

createApp(App).use(ZBaseUi).mount('#app')

全局部分注册

此种方法仍需在 main.ts 或 main.js 中进行注册，不同的是只会在全局内加载导入的组件，而非全部加载。

import { createApp } from 'vue'
import App from './App.vue'
import { ZButton, ZIcon} from "@d7ee/z-base-ui";
import "@d7ee/z-base-ui/dist/index.css"

createApp(App)
  .use(ZButton)
  .use(ZIcon)
  .mount('#app')

局部注册

此种方法需要在使用的地方进行注册，注册后只在当前组件中生效。

<template>
  <z-button>测试</z-button>
</template>

<script>
  import { ZButton } from "@d7ee/z-base-ui";
  export default {
    components: {
      ZButton,
    }
  }
</script>

按需加载

z-base-ui 默认支持基于 ES modules 的 tree shaking，直接引入 import { ZButton } from '@d7ee/z-base-ui'; 就会有按需加载的效果。