open-index/open-npm huggingface dataset:
npm package: @srcker/editor-vue-next
Description: 一个基于 Tiptap 的富文本编辑器，具有丰富的文本编辑功能。
Latest version: 1.1.1

# Rich Editor

一个基于 Tiptap 的富文本编辑器，具有丰富的文本编辑功能。

## 功能特性

- 基础文本格式化：加粗、斜体、下划线、删除线
- 标题设置
- 字体大小调整
- 颜色设置（文字颜色、背景高亮）
- 行高和缩进控制
- 对齐方式
- 列表（有序和无序）及样式
- 引用块
- 链接
- 待办事项
- 代码块
- 分割线
- **图片上传功能**

## 快速开始

安装依赖：

```bash
npm i @srcker/editor-vue-next
```

使用方法：

```bash

# 引入组件
import { RichEditor } from '@srcker/editor-vue-next'
# 引入样式
import '@srcker/editor-vue-next/style/toolbar'
import '@srcker/editor-vue-next/style/content'

# 使用组件
<RichEditor v-model="form.content" theme="dark" format="html" />

```

参数说明
## 配置项
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| theme | 主题，可选值：`light`、`dark` | string | `light` |
| format | 输出格式，可选值：`html`、`json` | string | `html` |
| uploadImage | 图片上传配置 | File | - |

## 图片上传配置
```
const uploadImage = async (file: File) => {
    console.log(file)
    return {
        url: '图片地址',
        name: '图片名称'
    }
}
```


## 技术栈

- Vue 3
- Tiptap
- SCSS

## 图片上传
编辑器支持通过工具栏按钮上传图片，支持常见的图片格式（JPG、PNG、GIF、WebP），最大支持5MB的文件。