Warning
Tiptap released a markdown extension in 3.7.0, please prefer using the official extension over this package. I don't plan to address current issues / PR.
The markdown extension for Tiptap editor.
For Tiptap v2
npm install tiptap-markdown@^0.8For Tiptap v3
npm install tiptap-markdown@latestSupports all frameworks handled by Tiptap (Vue 2, Vue 3, React, see full list...)
Basic example:
import { Editor } from '@tiptap/core';
import StarterKit from '@tiptap/starter-kit';
import { Markdown } from 'tiptap-markdown';
const editor = new Editor({
content: "# Title",
extensions: [
StarterKit,
Markdown,
],
});
const markdownOutput = editor.storage.markdown.getMarkdown();Default options:
Markdown.configure({
html: true, // Allow HTML input/output
tightLists: true, // No <p> inside <li> in markdown output
tightListClass: 'tight', // Add class to <ul> allowing you to remove <p> margins when tight
bulletListMarker: '-', // <li> prefix in markdown output
linkify: false, // Create links from "https://..." text
breaks: false, // New lines (\n) in markdown input are converted to <br>
transformPastedText: false, // Allow to paste markdown text in the editor
transformCopiedText: false, // Copied text is transformed to markdown
})editor.commands.setContent('**test**') // setContent supports markdown format
editor.storage.markdown.getMarkdown(); // get current content as markdownSee examples.
Check out prosemirror-markdown default serializer for examples of serialize config. Check out markdown-it plugins for parsing.
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.
Please make sure to update tests as appropriate.
The MIT License (MIT). Please see License File for more information.