Fa UI 组件库

一个基于 Vue 3 的现代化 UI 组件库，包含丰富的组件和功能。

安装

npm install fa-ui
# 或
yarn add fa-ui
# 或
pnpm add fa-ui

使用方法

完整引入

import { createApp } from 'vue'
import FaUI from 'fa-ui'
import 'fa-ui/style'

const app = createApp(App)
app.use(FaUI)

按需引入

import { FaButton, FaCard, FaInput } from 'fa-ui'
import 'fa-ui/style'

// 在组件中使用
export default {
  components: {
    FaButton,
    FaCard,
    FaInput
  }
}

组件列表

基础组件

• FaButton - 按钮组件
• FaInput - 输入框组件
• FaTextarea - 文本域组件
• FaSelect - 选择器组件
• FaCheckbox - 复选框组件
• FaSwitch - 开关组件
• FaSlider - 滑块组件
• FaProgress - 进度条组件

布局组件

• FaCard - 卡片组件
• FaDivider - 分割线组件
• FaLayoutContainer - 布局容器组件
• FaPageHeader - 页面头部组件
• FaPageMain - 页面主内容组件

反馈组件

• FaModal - 模态框组件
• FaDrawer - 抽屉组件
• FaPopover - 弹出框组件
• FaTooltip - 工具提示组件
• FaNotification - 通知组件
• FaToast - 吐司组件
• FaLoading - 加载组件

导航组件

• FaTabs - 标签页组件
• FaPagination - 分页组件
• FaDropdown - 下拉菜单组件
• FaContextMenu - 上下文菜单组件
• FaTree - 树形组件

数据展示组件

• FaAvatar - 头像组件
• FaBadge - 徽章组件
• FaTimeline - 时间线组件
• FaSparkline - 迷你图表组件
• FaTrend - 趋势组件
• FaCountTo - 数字动画组件
• FaTimeAgo - 时间显示组件

动画组件

• FaAnimatedBeam - 光束动画组件
• FaAnimatedCountTo - 数字动画组件
• FaAnimatedCountToGroup - 数字动画组组件
• FaBlurReveal - 模糊显示组件
• FaBorderBeam - 边框光束组件
• FaFlipCard - 翻转卡片组件
• FaFlipWords - 翻转文字组件
• FaGlowyCard - 发光卡片组件
• FaGlowyCardWrapper - 发光卡片包装器组件
• FaGradientButton - 渐变按钮组件
• FaInteractiveButton - 交互按钮组件
• FaMarquee - 跑马灯组件
• FaMultiStepLoader - 多步骤加载器组件
• FaParticlesBg - 粒子背景组件
• FaPatternBg - 图案背景组件
• FaScratchOff - 刮刮乐组件
• FaSmoothSwipe - 平滑滑动组件
• FaSparklesText - 闪烁文字组件
• FaSpotlightCard - 聚光灯卡片组件

其他组件

• FaIcon - 图标组件
• FaIconPicker - 图标选择器组件
• FaCode - 代码组件
• FaCodePreview - 代码预览组件
• FaImagePreview - 图片预览组件
• FaImageUpload - 图片上传组件
• FaFileUpload - 文件上传组件
• FaSearchBar - 搜索栏组件
• FaScrollArea - 滚动区域组件
• FaPinInput - 密码输入组件
• FaHoverCard - 悬停卡片组件
• FaCarousel - 轮播组件
• FaCollapsible - 折叠组件
• FaBackToTop - 回到顶部组件
• FaCopyright - 版权组件
• FaDigitalCard - 数字卡片组件
• FaFixedActionBar - 固定操作栏组件
• FaLinkPreview - 链接预览组件
• FaLoginAgain - 重新登录组件
• FaNotAllowed - 禁止访问组件
• FaPasswordStrength - 密码强度组件
• FaSmartFixedBlock - 智能固定块组件
• FaStorageBox - 存储盒组件
• FaTextHighlight - 文本高亮组件

依赖要求

本组件库需要以下 peer dependencies：

• Vue 3.5+
• Element Plus 2.0+
• Tailwind CSS / UnoCSS
• @vueuse/core
• 以及其他相关依赖

构建信息

• 构建工具：Vite
• 支持格式：ES Module, UMD
• TypeScript 支持：是
• CSS 框架：Tailwind CSS / UnoCSS

开发

# 安装依赖
npm install

# 开发模式
npm run dev

# 构建组件库
npm run build:lib

# 监听模式构建
npm run build:lib:watch

许可证

MIT License