@yunlefun/vue

@yunlefun/vue

YunLeFun Design 的 Vue 组件实现，提供 Ylf* 组件与 Nuxt 集成。

安装

pnpm add @yunlefun/ui @yunlefun/vue
pnpm add -D sass

在应用 SCSS 入口加载共享主题：

@use '@yunlefun/ui/styles';

Vue / Vite

<script setup lang="ts">
import YlfButton from '@yunlefun/vue/components/YlfButton.vue'
</script>

<template>
  <YlfButton>保存资料</YlfButton>
</template>

Nuxt

export default defineNuxtConfig({
  modules: ['@yunlefun/vue/nuxt'],
  css: ['@yunlefun/ui/styles'],
})

根入口目前提供类型和组件目录信息，组件通过 components/*.vue 子路径或 Nuxt 模块使用；没有公开的 YlfResolver。

组件子路径提供预生成类型声明，运行时继续使用原始 SFC。现有 15 个 Reka UI 封装的验收范围见组件验收。

更多内容见 Vue 接入、子包职责与设计体系。

AI 提示词入口

YlfAiPromptLauncher 统一元宝、豆包、DeepSeek、ChatGPT、Claude 与 Cursor 的 logo、带提示词跳转和完整复制兜底。@yunlefun/vue/ai-prompt 提供可用于 CMS 主进程的纯链接构建函数；Vue 组件通过 launch / copyText 对接宿主。

接口、站点能力与接入示例见 AI 提示词入口。

AG-UI 可选接入

从 0.5.0 起，@yunlefun/vue/ag-ui 提供 useAgUiAgent(agent)，将官方 @ag-ui/client 的流式消息、共享状态、取消、工具结果与 interrupt/resume 映射为 Vue 状态。仅使用此入口时才需要安装 @ag-ui/client；普通组件与 Nuxt 集成不依赖它。

工具操作由宿主校验并显式执行。设置 composable 不连接服务，Vue scope 销毁时自动取消与退订。双语演示、固定发行包和后端连接示例见 AG-UI 接入。