vue-quill-editor
@quilljs editor component for @vuejs(2)
A deprecated Vue 2 rich text editor component wrapping the Quill library, supporting bold text, headings, images, and custom extension modules for drag-and-drop uploads or tables.
vue-quill-editor is a rich text editor component built for Vue 2, a popular JavaScript framework for building web interfaces. A rich text editor is the kind of editing box where you can bold text, add headings, insert images, and format content the way you would in a word processor, rather than typing plain text. This particular editor wraps a library called Quill, which handles the actual editing functionality.
Important context from the README: this project is deprecated. The Quill library it depends on stopped receiving updates, and the maintainer has marked vue-quill-editor as no longer actively supported. The README recommends migrating to a different editor called Tiptap if you need Vue 3 support. The project will only continue if Quill itself resumes development.
Installing it follows the standard package manager route with npm or yarn. It can also be loaded directly via script tags in an HTML page without any build tools. Once installed, you register it with your Vue application either globally (making it available everywhere) or locally within a specific component. The README shows how to bind the editor content to a variable in your Vue component using Vue's two-way data binding, so the editor and your code stay in sync automatically.
The component exposes event hooks for when the editor gains focus, loses focus, is ready to use, or when its content changes. It also supports adding Quill extension modules, which are third-party add-ons that extend the editor with capabilities like image resizing, drag-and-drop image uploading, or table support. The README lists several such modules with links.
A note on compatibility: this works only with Vue 2. There is no supported Vue 3 version of this package.
Where it fits
- Add a word-processor-style text editor to a Vue 2 app where users can bold text, add headings, and insert images.
- Bind the editor content to a Vue data property so formatted text stays in sync with your component state automatically.
- Extend the editor with a Quill module for drag-and-drop image uploads inside an existing Vue 2 project.