文章归档于:https://www.yuque.com/u27599042/row3c6文章来源地址https://www.toymoban.com/news/detail-701730.html
组件库地址
- npm:https://www.npmjs.com/package/xwb-ui?activeTab=readme
- 小尾巴 UI 组件库源码 gitee:https://gitee.com/tongchaowei/xwb-ui
- 小尾巴 UI 组件库测试代码 gitee:https://gitee.com/tongchaowei/xwb-ui-test
下载
- npm
npm i xwb-ui
- pnpm
pnpm i xwb-ui
- yarn
yarn add xwb-ui
UI 样式配置
- 在 main.js / main.ts 文件中,引入组件库 UI 样式
import 'xwb-ui/style.css' // 导入小尾巴 UI 样式
引入 UI 组件库
按需引入
import {
// 组件名
} from 'xwb-ui'
完整引入
- 通过 UI 组件库中内置的插件 XWB_UI,将组件库中所有组件注册为全局组件
import {createApp} from 'vue'
import App from './App.vue'
import 'xwb-ui/style.css' // 导入小尾巴 UI 样式
import XWB_UI from 'xwb-ui' // 导入将组件库中所有组件注册为全局组件的插件
const app = createApp(App)
// 使用 XWB_UI 插件
app.use(XWB_UI)
app.mount('#app')
各组件说明与使用
- 对于各组件的说明与使用,请参考:[构建自己的 Vue 组件库] 小尾巴 UI 组件库
文章来源:https://www.toymoban.com/news/detail-701730.html
到了这里,关于[小尾巴 UI 组件库] 组件库配置与使用的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!