组件库的使用

简介: 组件库的使用

分两大类:移动端、 PC 端

移动端: Vant 、 NutUI 、 TDesgin

PC 端: TDesgin 、 antd 、 element-plus



vant为例:

1. 安装: npm i vant

2. main.js 引入组件的 css

3. main.js 引入需要的组件

 

import { createApp } from 'vue'
import App from './App.vue'
// 导入路由实例
import router from './router';
// 引入组件
import { Button, Popup, Swipe, SwipeItem } from 'vant';
// vue实例
const app = createApp(App)
// 引入组件样式
import 'vant/lib/index.css';
// 在vue实例上安装路由
app.use(router)
// 注册组件
app.use(Button).use(Popup).use(Swipe).use(SwipeItem)
app.mount('#app')
相关文章
|
9月前
为什么要使用组件库?
为什么要使用组件库?
267 0
|
前端开发
从0搭建Vue3组件库(七):使用 gulp 打包组件库并实现按需加载
从0搭建Vue3组件库(七):使用 gulp 打包组件库并实现按需加载
393 0
|
9月前
|
JavaScript 前端开发
推荐一个非常好用的uniapp的组件库【TMUI3.0】
推荐一个非常好用的uniapp的组件库【TMUI3.0】
627 1
|
前端开发 程序员
前端反卷计划-组件库-02-storybook
前端反卷计划-组件库-02-storybook
前端反卷计划-组件库-02-storybook
|
前端开发 程序员
前端反卷计划-组件库-03-组件样式
前端反卷计划-组件库-03-组件样式
组件库 | 步骤条
在写移动端步骤条的时候,发现第三方的步骤条满足不了需求,于是手写了一个
100 0
|
前端开发
React组件导入的两种方式(动态导入组件的实现)
React组件导入的两种方式(动态导入组件的实现)
418 0
|
开发工具 git
从0搭建Vue3组件库(八):使用 release-it 实现自动管理发布组件库
从0搭建Vue3组件库(八):使用 release-it 实现自动管理发布组件库
212 0
|
JavaScript 编译器
从0搭建Vue3组件库(三): 组件库的环境配置
从0搭建Vue3组件库(三): 组件库的环境配置
222 0
|
前端开发 JavaScript 编译器
搭建Vue3组件库:第十三章 实现组件库按需引入功能
本章介绍组件库如何实现按需引入。
1969 0
搭建Vue3组件库:第十三章 实现组件库按需引入功能