🎨
框架无关
核心包不依赖任何前端框架，可以在任何项目中使用
Elegant Editor现代化的富文本编辑器
基于 TipTap 构建，支持 Vue 3 和原生 JavaScript
Skip to content
快速安装
bash
# Vue 3 项目
pnpm add @frame-flex/vue @frame-flex/exporters
# 原生 JavaScript 项目
pnpm add @frame-flex/core @frame-flex/exportersbash
# Vue 3 项目
npm install @frame-flex/vue @frame-flex/exporters
# 原生 JavaScript 项目
npm install @frame-flex/core @frame-flex/exportersbash
# Vue 3 项目
yarn add @frame-flex/vue @frame-flex/exporters
# 原生 JavaScript 项目
yarn add @frame-flex/core @frame-flex/exporters快速使用
Vue 3
vue
<template>
<RichTextEditor v-model="content" />
</template>
<script setup lang="ts">
import { ref } from 'vue';
import { RichTextEditor } from '@frame-flex/vue';
import '@frame-flex/vue/styles';
const content = ref({
type: 'doc',
content: []
});
</script>原生 JavaScript
typescript
import { Editor } from '@frame-flex/core';
import '@frame-flex/core/styles';
const editor = new Editor(document.getElementById('editor'), {
content: '<p>Hello World!</p>',
editable: true
});为什么选择 Elegant Editor？
轻量高效
- 核心包: ~59 KB (未压缩), ~15 KB (Gzipped)
- Vue 包: ~10 KB (未压缩), ~3.3 KB (Gzipped)
- 导出包: ~12 KB (未压缩), ~4.8 KB (Gzipped)
生产就绪
- ✅ 完整的 TypeScript 支持
- ✅ 全面的单元测试
- ✅ 详细的文档和示例
- ✅ 活跃的社区支持
开发友好
- 🔥 热重载支持
- 📚 丰富的示例代码
- 🛠️ 强大的开发工具
- 📖 完善的 API 文档