zjzx-fv-package3

基于 Vue 3 + Element Plus + Vite 重构的二开组件库，是 zjzx-fv-package（Vue2 + Element UI）的 Vue3 版本。

对外的配置式 API（tableConfig / searchConfig / formConfig / treeConfig、各 item.type、事件名）与 Vue2 版保持一致，下游业务页的 config 基本无需改动即可迁移，只需切换框架与安装方式。

环境

• Node 建议 ≥ 18（推荐 20+）
• Vue 3.4、Element Plus 2.7、Vite 5

命令

npm install        # 安装依赖
npm run dev        # 启动 demo (src/) 开发服务器, 默认 8080
npm run build      # 构建 demo 应用 -> dist/
npm run lib        # 构建组件库 (es + umd) -> lib/

组件

| 组件 | 名称 | 说明 | |---|---|---| | fvForm | FvForm | 配置驱动表单 | | fvCurd | FvCurd | 配置驱动 CRUD（表格 + 搜索 + 弹窗表单） | | fvTree | FvTree | 树组件（基于 Element Plus el-tree 薄封装） |

安装使用

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import fvPackage from 'zjzx-fv-package3'

const app = createApp(App)
app.use(ElementPlus)
// 若宿主已有 vue-i18n 实例, 通过 i18n 选项传入, 库会把多语言 message 合并进去
app.use(fvPackage, { lang: 'zh' /*, i18n: yourI18nInstance */ })

也支持按需安装单个组件：app.use(fvForm)。

从 Vue2 版迁移的主要改动

• 构建：vue-cli/webpack → Vite（require.context → import.meta.glob，svg-sprite-loader → vite-plugin-svg-icons）。
• UI 库：Element UI → Element Plus（图标由字体类 el-icon-* 改为图标组件）。
• API 变更：.sync → v-model:xxx；slot / slot-scope → #slot / v-slot；$emit('input')/value → update:modelValue/modelValue；filters → 方法；指令 bind/update/unbind → beforeMount/updated/unmounted。
• i18n：vue-i18n v8 → v9；不再覆写 Vue.prototype._init，改为标准 app.use。
• 全局：Vue.prototype.$api → app.config.globalProperties.$api；Element Plus 不再自动注入 $message/$confirm/$notify，demo 在 main.js 中手动挂载以兼容组件内用法。
• fvTree：原为 element-ui el-tree 的源码 fork（深度依赖 element-ui/src/* 内部路径），Vue3 版改为对 el-tree 的薄封装并透传全部对外方法/事件，原 tree/src/model/* 自维护数据模型已移除。

目录

packages/            组件库源码（库构建入口 packages/index.js）
  form/  curd/  tree/
src/                 共享依赖 + demo 应用
  components/  utils/  directive/  lang/  icons/  api/  vendor/  views/
vite.config.js       lib 模式 / 应用模式双构建