Package Exports

vue3-markdown-it

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue3-markdown-it) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

vue3-markdown-it

A Vue 3 markdown-it wrapper plugin.

Installation

npm install vue3-markdown-it

Supported Plugins

markdown-it - The one that started it all
markdown-it-abbr - Add abbreviations
markdown-it-anchor - Add anchors
markdown-it-deflist - Add definition lists
markdown-it-emoji - Add emojis
markdown-it-footnote - Add footnotes
markdown-it-highlightjs - Add highlighting for code blocks
markdown-it-ins - Add <ins> tags
markdown-it-latex - Add LaTeX formatting
markdown-it-mark - Add marking/highlighting
markdown-it-strikethrough-alt - Add strikethrough
markdown-it-sub - Add subscript
markdown-it-sup - Add superscript
markdown-it-task-lists - Add task lists
markdown-it-toc-done-right - Add table of contents

Usage

Global Use

import { createApp } from 'vue';
import VueMarkdownIt from 'vue3-markdown-it';

const app = createApp();

app.use(VueMarkdownIt);

CSS

import 'vue3-markdown-it/lib/vue3-markdown-it.css';

Single Use

<template>
  <div>
    <vue3-markdown-it :source='source' />
  </div>
</template>

<script>
import VueMarkdownIt from 'vue3-markdown-it';

export default {
  components: {
    VueMarkdownIt
  },
  data() {
    return {
      source: '# Hello World!'
    }
  }
}
</script>

Props

The following properties are supported:

`anchor`

View markdown-it-anchor for more information.

Type: Object | Default value: null

`breaks`

Convert \n in paragraphs into <br>.

Type: Boolean | Default value: false

`emoji`

View markdown-it-emoji for more information.

Type: Object | Default value: null

`highlight`

View markdown-it-highlightjs for more information.

Type: Object | Default value: null

`html`

Enable HTML tags in source.

Type: Boolean | Default value: false

`langPrefix`

CSS language prefix for fenced blocks. Can be useful for external highlighters.

Type: String | Default value: language-

`quotes`

Double + single quotes replacement pairs, when typographer enabled and smartquotes on. Could be either a String or an Array. For example, you can use «»„“ for Russian, „“‚‘ for German, and ['«\xA0', '\xA0»', '‹\xA0', '\xA0›'] for French (including nbsp).

Type: String | String[] | Default value: “”‘’

`source`

Content to be rendered into markdown.

Type: String | Default value: null

`tasklists`

View markdown-it-task-lists for more information.

Type: Object | Default value: null

`toc`

View markdown-it-toc-done-right for more information.

Type: Object | Default value: null

`typographer`

Enable some language-neutral replacement + quotes beautification.

Type: Boolean | Default value: false

`xhtmlOut`

Use / to close single tags (<br />).

Type: Boolean | Default value: false

License

MIT