@wallowyou/ui
v1.0.0
Published
vue3 admin components
Downloads
3
Readme
layout: doc
快速上手
@nw/ui
为封装的常用组件库
在开始之前,由于大部分组件都是基于ant-design-vue,所以首先需要安装ant-design-vue,样式文件暂时打包进封装的@nw/ui
安装
你可以选择npm
, yarn
, pnpm
安装
组件库的peerDependencies
有 @ant-design/icons-vue,@vueuse/core,ant-design-vue,lodash-es,resize-observer-polyfill,vue所以你需要提前安装它们
# 选择一个包管理器
# NPM
npm install @nw/ui --save
# Yarn
yarn add @nw/ui
# pnpm
pnpm install @nw/ui
使用组件
该组件库没有把ant-design-vue
组件库的样式文件打包,所以使用先需要先引入以下组件
import {Button, Menu,Divider,Popover,Modal,Tooltip} from 'ant-design-vue'
app.use(Button).use(Menu).use(Divider).use(Popover).use(Modal).use(Tooltip)
全局完整注册
import { createApp } from 'vue';
import nwui from '@nw/ui'
import App from './App';
import '@nw/ui/dist/es/style.css'
const app = createApp(App);
app.use(nwui).mount('#app');
局部注册组件
样式文件暂时全部在main.ts全局引入
import { ScrollBar } from '@nw/ui'
export default {
components: {
ScrollBar
},
};