mdx-js-vue3

@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())
    }
  }
}