# mdx-js-vue3

> MDX support for Vue 3 components

Latest version **1.1.0** (published 2020-12-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install mdx-js-vue3
pnpm add mdx-js-vue3
yarn add mdx-js-vue3
bun add mdx-js-vue3
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.0 |
| Published | 2020-12-25 |
| First published | 2020-12-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 1.3 MB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Jonathan Bakebwa |
| Maintainers | ahcl7 |
| Keywords | markdown, vue, mdx, remark |

## Links

- npm: https://www.npmjs.com/package/mdx-js-vue3
- npm.io page: https://npm.io/package/mdx-js-vue3

## Alternatives

- [@mdxeditor/editor](https://npm.io/package/@mdxeditor/editor.md) — 962.4K weekly downloads
- [mmdb-lib](https://npm.io/package/mmdb-lib.md) — 680.9K weekly downloads
- [playcanvas](https://npm.io/package/playcanvas.md) — 36.2K weekly downloads
- [@glw907/cairn-cms](https://npm.io/package/@glw907/cairn-cms.md) — 967 weekly downloads
- [markdown-to-confluence](https://npm.io/package/markdown-to-confluence.md) — 103 weekly downloads

## Recent versions

- 1.1.0 (latest) — 2020-12-25
- 1.0.1 — 2020-12-25
- 1.0.0 — 2020-12-24

## README

# `@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][]:

```sh
npm install mdx-js-vue3
```

[yarn][]:

```sh
yarn add mdx-js-vue3
```

## Use

Say we have the following code in `example.mdx`:

```markdown
# Hello, world! {1 + 1}
```

And our script, `example.jsx`:

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

```

---
_Source: https://npm.io/package/mdx-js-vue3 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._