Vue component Rich Text Editor WYSIWYG

Khampasith Chanthavong
MounoyDev
Published in
3 min readAug 26, 2019

--

1. Trumbowyg

Light, translatable and customisable jQuery plugin.
Beautiful design, generates semantic code, comes with a powerful API.

- HTML5 & semantic

Editor and generated code are optimized for HTML5 support. Compatible with all recents browsers like IE9+, Chrome, Opera and Firefox.

Fast & lightweight

All existing WYSIWYG editors are larger than 45kB. Trumbowyg is only 20kB which means faster page loading. No useless features, just the necessary ones to generate clean, semantic code.

Customizable

Options and design are entirely configurable to suit your needs. However, the default design is compatible with Retina display and optimized for a great and simple user experience.

2. Vueditor

A wysiwyg editor written in Vue.js and Vuex.js, require Vue.js 2.0.0, Vuex.js 2.0.0 and above.

Browser compatibility: Chrome, Firefox, Safari, IE 9+.

Online DEMO

3. Tiptap

A renderless and extendable rich-text editor for Vue.js

visit tiptap.scrumpy.io.

4. vue-wysiwyg

A lightweight WYSIWYG HTML editor for Vue.js https://chmln.github.io/vue-wysiwyg/

5. Vue JS Froala WYSIWYG Editor

Vue component for Froala WYSIWYG HTML Rich Text Editor. https://froala.com/wysiwyg-editor

vue-froala-wyswiyg provides Vue bindings to the Froala WYSIWYG editor VERSION 3.

6. Vue-Quill-Editor

Quill editor component for Vue

DEMO: https://surmon-china.github.io/vue-quill-editor/

Vue2Editor

Your Vue.js editor for rich text editing built with Vue.js and Quill.js

7. Froala Editor

Beautiful Javascript web editor that’s easy to integrate for developers and your users will simply fall in love with its clean design.

8.TinyMCE Vue component

9.CKEditor

Modern JavaScript rich text editor with a modular architecture. Its clean UI and features provide the perfect WYSIWYG UX ❤️ for creating semantic content.

--

--