@yanivjs/gamma-mini-editor
v0.0.3
Published
Public Vue 3 + Tiptap document/card editor core for SPA embedding
Maintainers
Readme
Gamma Mini Editor
@yanivjs/gamma-mini-editor 是公开发布到 npm 的 Vue 3 + Tiptap 文档/卡片编辑器核心包。仓库保留了从同级 gamma-project 同步编辑器核心源码的维护脚本,但当前项目本身是独立 Vite/Vue 库工程,最终产物是可被普通 Vue SPA 引用的 npm 包。
环境要求
- Node.js 版本需满足当前 Vite / TypeScript 工具链要求。
- 包管理器使用
[email protected](见packageManager)。 - 仓库开发安装按
.npmrc分 registry:默认公共包走官方 npm,@tiptapscope 走 Verdaccio,用于解析源码依赖中的@tiptap/*-isheji*版本。 - 需要从源项目同步编辑器源码时,默认要求同级存在
../gamma-project,也可以通过GAMMA_PROJECT_DIR指定路径。 - 当前源码不依赖提交到仓库的
.env;本地私有环境变量请使用未跟踪的.env.local。
仓库开发
本仓库按普通 Yarn 项目维护:
yarn install
yarn dev
yarn build.npmrc 只能按 scope 分流,不能按版本号分流;因为私有 fork 和公开 Tiptap 包都在 @tiptap scope 下,所以 @tiptap 统一走 Verdaccio,并要求 Verdaccio 能代理公开 Tiptap 包。
需要从 gamma-project 刷新编辑器核心源码时再执行:
yarn sync:src该同步只拷贝编辑器核心,并保留本仓面向 npm 发布的最小类型、样式和 stub 边界。
本地 yarn dev 使用 src/App.vue 作为测试壳,测试数据来自 src/mockData.js:
mockCardData:编辑器文档 JSON。mockThemeData:主题 JSON,传入setThemeStyle。
本地 mock 只保留编辑器实际消费的数据,不保留接口响应包络。
同步范围
会同步
| 内容 | 说明 |
| ---- | ---- |
| src/components/tiptap | Tiptap 节点、插件和编辑器核心 UI |
| src/components/editor/EditorContent.vue | 对外渲染入口组件 |
| src/components/SvgIcon、色板组件 | 编辑器依赖的基础 UI |
| src/stores/docEditor.ts | 文档编辑状态 |
| src/utils/cardTemplates.ts、changeTheme.ts、颜色/图片工具 | 卡片渲染和主题能力 |
| src/assets/image/editor、src/assets/image/side_tool、编辑器样式 | 编辑器素材与样式 |
不会同步
- 登录、支付、用户、请求层、接口封装等
gamma-project业务。 - AI 配图、邀请、通知、深度研究等产品功能。
gamma-project专用 store、hooks、业务类型和图片素材。
本仓保留的边界文件
src/stores/mediaDrawer.ts:媒体抽屉 stub。编辑器节点可编译运行,但不接入 AI 配图面板。src/hooks/index.ts:空导出,明确不暴露宿主业务 hooks。src/types/theme.ts:ThemeDetail/ThemeStyleConfig的唯一来源。src/gamma-mini-editor.public.d.ts:对外 API 声明模板,构建时会合并主题类型生成dist/gamma-mini-editor.es.d.ts。
不会保留组件旁路声明文件,例如 src/components/editor/EditorContent.d.ts。对外类型统一从 src/gamma-mini-editor.public.d.ts 生成。
对外入口
包入口为 src/lib.ts,当前导出:
EditorContentComponentinjectCardStyleVariablesupdateCardDimensionscardDimensionsgetAspectRatioCardSizeManagersetThemeStylecreateEditorPiniaVERSIONThemeDetail、ThemeStyleConfig
使用者需要引入样式:
import '@yanivjs/gamma-mini-editor/style.css'宿主应用需要安装并注册 Pinia。可直接使用本包导出的 createEditorPinia() 创建实例。
npm 发布
从仓库根目录发布,不要 cd dist:
yarn build
npm publish --dry-run --registry https://registry.npmjs.org
npm publish --registry https://registry.npmjs.org --access public完整步骤见 PUBLISH.md。
