Fujica UI

基础的 uni-app 组件库，包含常用的基础组件。

📦 安装

npm 安装

npm install @fujica/components
# 或
pnpm add @fujica/components
# 或
yarn add @fujica/components

uni_modules 安装

将项目克隆或下载后，复制 src/components 目录到你的 uni-app 项目的 src/uni_modules/@fujica/components/components 目录下。

🚀 使用方式

方式一：uni-app 项目（推荐）

默认导入源码，让 uni-app 编译系统处理多端编译：

<template>
  <view>
    <fs-button type="primary">主要按钮</fs-button>
    <fs-icon name="search" size="24px" />
    <fs-input v-model="value" placeholder="请输入" />
  </view>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { FsButton, FsIcon, FsInput } from '@fujica/components'

const value = ref('')
</script>

方式二：非 uni-app 项目

如果在普通 Vue 项目中使用编译后的版本：

import { FsButton, FsIcon, FsInput } from '@fujica/components/dist'

或在 Vite 配置中添加别名：

// vite.config.ts
export default {
  resolve: {
    alias: {
      '@fujica/components': '@fujica/components/dist'
    }
  }
}

📚 组件列表

• FsButton - 按钮组件
• FsIcon - 图标组件
• FsInput - 输入框组件

💡 类型支持

项目已内置 TypeScript 类型定义，支持：

• ✅ 组件 Props 类型提示
• ✅ 全局组件类型（Volar 支持）
• ✅ 工具函数类型

📖 文档

运行文档站点：

pnpm docs:dev

🛠 开发

# 安装依赖
pnpm install

# H5 开发
pnpm dev:h5

# 微信小程序开发
pnpm dev:mp-weixin

# 构建库文件（发布前）
pnpm build:lib

# 文档开发
pnpm docs:dev

# 构建文档
pnpm docs:build

📝 发布流程

1. 更新版本号：编辑 package.json 中的 version 字段
2. 构建库文件：pnpm build:lib
3. 发布到 npm：npm publish --access public

License

MIT