tiptap

A rich-text editor for Vue.js

Installation

npm install tiptap

Setup

<template>
  <editor>
    <!-- Add HTML to the scoped slot called "content" -->
    <div slot="content" slot-scope="props">
      <p>Hello world</p>
    </div>
  </editor>
</template>

<script>
// Import the editor
import { Editor } from 'tiptap'

export default {
  components: {
    Editor,
  },
}
</script>

Editor Properties

Property	Type	Default	Description
editable	Boolean	true	When set to false the editor is read-only.
doc	Object	null	The editor state object used by Prosemirror. You can also pass HTML to the content slot. When used both, the content slot will be ignored.
extensions	Array	[]	A list of extensions used, by the editor. This can be Nodes, Marks or Plugins.
@update	Function	undefined	This will return the current state of Prosemirror on every change.

Extensions

Soon … Until then you can take a look at the embed example.

Contributing

Please see CONTRIBUTING for details.

Credits

• Philipp Kühn
• All Contributors

License

The MIT License (MIT). Please see License File for more information.