# @secretflow/dumi-plugin-mdx

> Dumi plugin to enable compiling .mdx files.

Latest version **0.3.0** (published 2024-01-29) · MIT license · 0 weekly downloads

## Install

```sh
npm install @secretflow/dumi-plugin-mdx
pnpm add @secretflow/dumi-plugin-mdx
yarn add @secretflow/dumi-plugin-mdx
bun add @secretflow/dumi-plugin-mdx
```

## Health

**Score 35/100 (D)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities.

Warnings: low downloads; pre 1.0.

Negative: abandoned.

## Facts

| | |
|---|---|
| Version | 0.3.0 |
| Published | 2024-01-29 |
| First published | 2023-08-24 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 11 |
| Unpacked size | 35.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 8 |
| Author | Tony Wu |
| Maintainers | tonywu6, bubkoo |

## Links

- npm: https://www.npmjs.com/package/@secretflow/dumi-plugin-mdx
- Repository: https://github.com/secretflow/doctools.git#main
- Homepage: https://github.com/secretflow/doctools/tree/main#readme
- Issues: https://github.com/secretflow/doctools/issues
- npm.io page: https://npm.io/package/@secretflow/dumi-plugin-mdx

## Dependencies (11)

- [yaml](https://npm.io/package/yaml.md) ^2.3.1
- [rehype-raw](https://npm.io/package/rehype-raw.md) ^6.1.1
- [remark-gfm](https://npm.io/package/remark-gfm.md) ^3.0.1
- [remark-math](https://npm.io/package/remark-math.md) ^5.1.1
- [rehype-katex](https://npm.io/package/rehype-katex.md) ^6.0.3
- [remark-directive](https://npm.io/package/remark-directive.md) ^2.0.1
- [unist-util-visit](https://npm.io/package/unist-util-visit.md) ^4.1.2
- [remark-frontmatter](https://npm.io/package/remark-frontmatter.md) ^4.0.1
- [remark-extract-frontmatter](https://npm.io/package/remark-extract-frontmatter.md) ^3.2.0
- [@secretflow/unified-toolkit](https://npm.io/package/@secretflow/unified-toolkit.md) ^0.4.0
- [@secretflow/dumi-mdx-loader-core](https://npm.io/package/@secretflow/dumi-mdx-loader-core.md) ^0.2.0

## Recent versions

- 0.3.0 (latest) — 2024-01-29
- 0.3.0-alpha.1.2 (alpha.1) — 2024-01-08
- 0.3.0-alpha.1.0 — 2024-01-08
- 0.2.0 — 2023-11-20
- 0.1.3-alpha.0 — 2023-10-18
- 0.1.2 — 2023-09-05
- 0.1.1 — 2023-08-31
- 0.1.0 — 2023-08-24

## README

# dumi-plugin-mdx

[![npm](https://img.shields.io/npm/v/%40mdx-js%2Fmdx?label=Powered%20by%20%40mdx-js%2Fmdx)](https://www.npmjs.com/package/@mdx-js/mdx)

Write your Dumi docs in [MDX](https://mdxjs.com/).

MDX lets you use proper JSX syntax in Markdown documents. No more
[fenced code magic](https://d.umijs.org/guide/write-demo#代码块) or [pretending it's HTML](https://d.umijs.org/theme/global-component#实践与限制).

```md
import { CoolComponent } from 'cool-component';
import { version } from 'cool-component/package.json';

# Cool react component

[![npm](https://img.shields.io/npm/v/%40mdx-js%2Fmdx?label=Powered%20by%20%40mdx-js%2Fmdx)](https://www.npmjs.com/package/@mdx-js/mdx)

> Version: {version}

Check out this cool component:

<CoolComponent coolness={10} style={{ color: "#fcb32c" }} />
```

## Who is using this?

- [隐语 SecretFlow 文档](https://www.secretflow.org.cn/docs/secretflow)

## Install and use

**This package is NOT PRODUCTION-READY.** It does not support all Dumi features, such as
component demos. Use at your own risk.

1. Install in a Dumi project.

   ```bash
   npm i -D dumi-plugin-mdx
   # or yarn, or pnpm
   ```

2. Add `dumi-plugin-mdx` to your `.dumirc.ts`.

   ```diff
   import { defineConfig } from 'dumi';

   export default defineConfig({
   + plugins: ['dumi-plugin-mdx'],
   });
   ```

3. Put .mdx files in your `docs` folder. See [MDX documentation](https://mdxjs.com/docs/what-is-mdx/) on how to write one.

   > You MUST use the `.mdx` extension. `.md` files will still be parsed as Markdown.

   ```md
   # Hello, world!

   <div className="note">
     > Some notable things in a block quote!
   </div>
   ```

4. Build away!

   ```bash
   npm run build
   # npm exec dumi build, or yarn, or pnpm
   ```

You can write .mdx files along side your existing .md files. Dumi's [routing](https://d.umijs.org/guide/conventional-routing) behavior will still apply.

```
docs
├── index.mdx
├── stable
│   └── existing-doc.md
└── next
    └── new-doc.mdx
.dumirc.ts
```

---

This is part of [secretflow/doctools], [SecretFlow]'s documentation toolchain.

[secretflow/doctools]: https://github.com/secretflow/doctools
[SecretFlow]: https://www.secretflow.org.cn/

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