@mdx-js/vue

[![Build][build-badge]][build]
[![Downloads][downloads-badge]][downloads]
[![Sponsors][sponsors-badge]][opencollective]
[![Backers][backers-badge]][opencollective]
[![Chat][chat-badge]][chat]

Vue renderer for [MDX][]: JSX in Markdown.

Install

[npm][]:

 npm install mdx-js-vue3

[yarn][]:

 yarn add mdx-js-vue3

Use

Say we have the following code in example.mdx:

 # Hello, world! {1 + 1}

And our script, example.jsx:

 import {MDXProvider} from 'mdx-js-vue3'
import Example from './example.mdx'
import {h} from 'vue'
const components = {
  h1: {
    render() {
      return h('h1', {style: {color: 'tomato'}}, this.$slots.default())
    }
  }
}