xiaohuoni / umi-plugin-md

Markdown(*.md) component plugin for umi.

umi-plugin-md ·

Markdown(*.md) component plugin for umi.

Create your website with umi and markdown only. Convenient and powerful for blog, documentation site and GitBook.

• Convert markdown into component: loaded by markdown-it and translate into React component.
• Auto routes create: auto create markdown routes from dir.
• XSS protect: by xss.

Installation

npm install umi-plugin-md

Usage

// .umirc.js
export default {
  plugins: ['umi-plugin-md'],
};

Options

option	intro	type	default
wrapper	HTMLElementTagName	string	section
className	React className	string
style	React style	object
html	markdown-it option	boolean	true
xhtmlOut	markdown-it option	boolean	true
breaks	markdown-it option	boolean	true
linkify	markdown-it option	boolean	true
typographer	markdown-it option	boolean	true
highlight	markdown-it option	function	highlight.js

tips: route of markdown will have higher priority, so route might be covered.

e.g, index.md will cover index.jsx.

Stylize

github-markdown-css

// global.css
@import "~github-markdown-css/github-markdown.css";

// .umirc.js
export default {
  plugins: [['umi-plugin-md', { className: 'markdown-body' }]],
};

Layout

Try _layout.js.

Example

See pages