评论-美容师
将人鱼格式的有栅栏的代码块替换为:
- 链接到已渲染的图形 SVG 文件( 默认模式) .
- 美人鱼格式化的代码用div标签包裹,用于由美人鱼(简单模式)渲染.
你也许也喜欢 remark-graphviz。 。 。 .
安装
$ npm install remark-mermaid mermaid.cli
使用量
使用 mermaid 可用 mermaid: 标题
将生成 SVG 图像.
[Link to a Graph](test/fixtures/assets/example.mmd "mermaid:")
或者,可以通过使用 mermaid 作为
用于栅栏编码块的语言标识符.
```mermaid
graph LR
Start --> Stop
```
看看这个项目 固定装置 需要更多的实例.
选项
simple: 当设置为true,插件将把人鱼图包入<div class="mermaid">元素而不是生成 SVG 。 默认为false。 。 。 .
示例
SVG 生成
鉴于一个文件, example.md,包含以下马克下:
# mermaid code block
```mermaid
graph LR
Start --> Stop
```
使用如下语句:
var vfile = require('to-vfile');
var remark = require('remark');
var mermaid = require('remark-mermaid');
var example = vfile.readSync('example.md');
remark()
.use(mermaid)
.process(example, function (err, file) {
if (err) throw err;
console.log(String(file));
});
将生成一个 SVG 相对 example.md和马克下
改为:
# mermaid code block
要改变 SVG 的写法,设置 data.destinationDir 在 vFile 上显示:
var vfile = require('to-vfile');
var remark = require('remark');
var mermaid = require('remark-mermaid');
var example = vfile.readSync('example.md');
example.data = {
destinationDir: '~/absolute/path/to/output'
};
remark()
.use(mermaid)
.process(example, function (err, file) {
if (err) throw err;
vfile.writeSync({ path: example.destinationFilePath });
});
这样您就可以从一个目录处理文件,并将结果保存到另一个目录.
简单模式
以下代码样本允许简单模式:
var vfile = require('to-vfile');
var remark = require('remark');
var mermaid = require('remark-mermaid');
var example = vfile.readSync('example.md');
remark()
.use(mermaid, { simple: true })
.process(example, function (err, file) {
if (err) throw err;
console.log(String(file));
});
这将产生以下马克下调输出 :
# mermaid code block
<div class="mermaid">
graph LR
Start --> Stop
</div>