Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/patleeman/quill-markdown-shortcuts

Quill.js module that converts markdown to rich text formatting while typing.
https://github.com/patleeman/quill-markdown-shortcuts

javascript markdown quilljs

Last synced: 8 days ago
JSON representation

Quill.js module that converts markdown to rich text formatting while typing.

Awesome Lists containing this project

README

        

# Quill Markdown Shortcuts

This package is a [Quill.js](https://quilljs.com) module that converts markdown on the fly to formatted rich text.

[Example](https://patleeman.github.io/quill-markdown-shortcuts/)

# Quickstart

## Installation

### Using NPM

Use the NPM package manager to add this dependency to your project.

```bash
npm i -S quill-markdown-shortcuts
```

### Using CDN

Add the library via jsdelivr.

```

```

### By downloading file

To incorporate the code into your codebase, simply download the markdownShortcuts.js file and include that in your build process or link a script tag to it directly. Then set up quill and make sure to include the markdownShortcuts setting in modules.

## Usage

### ES6

```js
import Quill from 'quill';
import MarkdownShortcuts from 'quill-markdown-shortcuts';

Quill.register('modules/markdownShortcuts', MarkdownShortcuts);

const quill = new Quill('#editor', {
theme: 'snow',
// All you need to do to enable the module is to add a modules key
// to your quill configuration, and add markdownShortcuts with an
// empty object.
// There are currently no options to set.
modules: {
markdownShortcuts: {}
}
});
```

### Script Tag

```html
<body>
<div class="container">
<div id="editor"></div>
<script src="/path/to/node_modules/quill-markdown-shortcuts/dist/markdownShortcuts.js">

var quill = new Quill('#editor', {
theme: 'snow',
// All you need to do to enable the module is to add a modules key
// to your quill configuration, and add markdownShortcuts with an
// empty object.
// There are currently no options to set.
modules: {
markdownShortcuts: {}
}
});