Markdown for Quill Editor


QuillJS Markdown shortcut Extension.

NPM

DEMO

Wrote Library with ES6 and Standard Javascript Codestyle.

How to install

$3

``
npm i quilljs-markdown
`

or

$3

`

`

How to use

`javascript
import Quill from 'quill'
import QuillMarkdown from 'quilljs-markdown'
import 'quilljs-markdown/dist/quilljs-markdown-common-style.css' // recommend import css, @option improve common style

const options = {
theme: 'snow'
}

document.addEventListener('DOMContentLoaded', () => {
const editor = new Quill('#editor', options)
const markdownOptions = {
/**
ignoreTags: [ 'pre', 'strikethrough'], // @option - if you need to ignore some tags.

tags: { // @option if you need to change for trigger pattern for some tags.
blockquote: {
pattern: /^(\|){1,6}\s/g,
},
bold: {
pattern: /^(\|){1,6}\s/g,
},
italic: {
pattern: /(\_){1}(.+?)(?:\1){1}/g,
},
},
*/
};

// markdown is enabled
const quillMarkdown = new QuillMarkdown(editor, markdownOptions)

// markdown is now disabled
// quillMarkdown.destroy()

})


`

Javascript 2 (Enable to Standard style for Quilljs)

`javascript
import Quill from 'quill'
import QuillMarkdown from '../src/app'

const toolbarOptions = [
['bold', 'italic', 'underline', 'strike'],
[ 'link', 'image'], // add's image support
];

const options = {
theme: 'snow',
modules: {
toolbar: toolbarOptions,
QuillMarkdown: {
ignoreTags: [ 'pre', 'strikethrough'], // @option - if you need to ignore some tags.

tags: { // @option if you need to change for trigger pattern for some tags.
blockquote: {
pattern: /^(\|){1,6}\s/g,
},
bold: {
pattern: /^(\|){1,6}\s/g,
},
italic: {
pattern: /(\_){1}(.+?)(?:\1){1}/g,
},
},
}
}
}

document.addEventListener('DOMContentLoaded', () => {
console.log('HOHO')

Quill.register('modules/QuillMarkdown', QuillMarkdown, true)

new Quill('#editor', options)
})

`

HTML

`html