@creatorsn/powereditor3
v0.2.5
Published
PowerEditor3 is a Vue 3 rich text editor component built on top of [Tiptap](https://tiptap.dev/) and [VFluent3](https://github.com/Creator-SN/VFluent3). It packages a ready-to-use editor with toolbar controls, theme switching, image preview, Markdown conv
Readme
English | 简体中文
PowerEditor3
PowerEditor3 is a Vue 3 rich text editor component built on top of Tiptap and VFluent3. It packages a ready-to-use editor with toolbar controls, theme switching, image preview, Markdown conversion, mention support, and extension points for business-specific editing flows.
The project is designed for real application pages where rich text needs to be edited, displayed, saved as HTML or JSON, converted to Markdown, or extended with custom upload and decoding logic.
Features
- Rich text editing based on Tiptap and ProseMirror.
- Vue 3 plugin installation with global
power-editorregistration. - Light and dark themes, powered by VFluent3 styling.
- HTML, JSON and Markdown save or conversion workflows.
- Custom toolbar buttons through Vue slots.
- Mention item configuration for user, topic or business entity selection.
- Markdown decoder plugins for custom node and mark serialization.
- Image interceptor API for upload, replacement and progress status handling.
Installation
Install the package with Yarn:
yarn add @creatorsn/powereditor3npm and pnpm work in a similar way.
Quick Start
Register PowerEditor3 in your Vue entry file, usually main.js:
import { createApp } from 'vue';
import App from './App.vue';
import PowerEditor from '@creatorsn/powereditor3';
import '@creatorsn/powereditor3/powereditor3.css';
const app = createApp(App);
app.use(PowerEditor);
app.mount('#app');Then use the editor in your Vue app:
<template>
<power-editor v-model="content" />
</template>
<script setup>
import { ref } from 'vue';
const content = ref('<p>Hello PowerEditor3</p>');
</script>Documentation
Read the full documentation, quick start guide and API reference:
https://creator-sn.github.io/PowerEditor3
Development
Clone the repository and install dependencies:
yarnStart the VitePress documentation site:
yarn docs:devBuild the documentation site:
yarn docs:buildBuild the library:
yarn buildRelated Projects
PowerEditor3 uses VFluent3 for its UI foundation:
https://github.com/Creator-SN/VFluent3
Contributing
PowerEditor3 is still growing, and feedback is welcome.
If you find a bug, have an idea, or want to improve the editor experience, please open an issue or submit a pull request.
License
PowerEditor3 is released under the MIT License.
Copyright (c) 2026 Creator SN
