Edit markdown content in tiptap editor.
npm install tiptap-markdown-3> [!WARNING]
As Tiptap have now a solution for markdown (paid Conversion extension and more markdown handling announced for v3). The original creator does not plan to release a v1 nor addressing current issues / PR in their repository. This is a fork of the project to update the dependency version for Tiptap v3 until the official supported option is release.
bash
npm install tiptap-markdown-3
`
$3
Supports all frameworks handled by Tiptap (Vue 2, Vue 3, React, see full list...)
Usage
Basic example:
`js
import { Editor } from '@tiptap/core';
import StarterKit from '@tiptap/starter-kit';
import { Markdown } from 'tiptap-markdown-3';
const editor = new Editor({
content: "# Title",
extensions: [
StarterKit,
Markdown,
],
});
const markdownOutput = editor.storage.markdown.getMarkdown();
`
API
$3
Default options:
`js
Markdown.configure({
html: true, // Allow HTML input/output
tightLists: true, // No inside
in markdown output
tightListClass: 'tight', // Add class to allowing you to remove margins when tight
bulletListMarker: '-', //
- prefix in markdown output
linkify: false, // Create links from "https://..." text
breaks: false, // New lines (\n) in markdown input are converted to
transformPastedText: false, // Allow to paste markdown text in the editor
transformCopiedText: false, // Copied text is transformed to markdown
})
`
$3
`js
editor.commands.setContent('test') // setContent supports markdown format
editor.storage.markdown.getMarkdown(); // get current content as markdown
``