Markdown文档元件使用说明

1 元件概述

1.1 运行环境

1.2 更新记录

1.3 元件介绍

Markdown文档元件是为原型设计软件Axure RP输出显示Markdowm文档而制作的元件，利用该元件可让Axure RP设计的原型具备输出Markdown文档的能力，通过在原型中书写Markdown格式的文档自动渲染为美观易于阅读的网页文档。该元件基于Vditor编辑器制作，Markdowm文档支持输出大纲、数学公式、脑图、图表、流程图、甘特图、时序图、五线谱、多媒体、语音阅读、标题锚点、代码高亮及复制、graphviz 渲染、plantumlUML 图等元素，支持主流浏览器，对移动端友好，配合官方开发的Markdown编辑器简直不要太好用！元件实现了HTML代码块功能，如果懂点HTML，发挥想象力，理论上可以实现任何网页效果。比如用它来编写PRD、数据字典、接口文档？后续如果有需要的话我会提供一些内容案例模版给大家，我始终期望并实践的一件事就是把那些乱七八糟的产品文档归到一份原型里，无论是word文档、表格数据、脑图还是流程图，其实只要一份原型文档就可以了，对吧？反正我已经这样做了，产品人，你们自己看着办吧。

1.4 语法支持

• 所有 CommonMark 语法：分隔线、ATX 标题、Setext 标题、缩进代码块、围栏代码块、HTML 块、链接引用定义、段落、块引用、列表、反斜杠转义、HTML 实体、行级代码、强调、加粗、链接、图片、行级 HTML、硬换行、软换行和纯文本。
• 所有 GFM 语法：表格、任务列表项、删除线、自动链接、XSS 过滤
• 常用 Markdown 扩展语法：脚注、ToC、自定义标题 ID
• 图表语法
• 流程图、时序图、甘特图，通过 Mermaid 支持
• Graphviz
• 折线图、饼图、脑图等，通过 ECharts 支持
• 五线谱：通过 abc.js 支持
• 数学公式：数学公式块、行级数学公式，通过 MathJax 和 KaTeX 支持
• YAML Front Matter
• 中文语境优化
• 中西文之间插入空格
• 术语拼写修正
• 中文后跟英文逗号句号等标点替换为中文对应标点
  以上大部分特性可以通过元件setting配置是否启用，设计者可根据自己的应用场景选择搭配。

2 使用说明及案例

2.1 元件使用方法

1. 离线版安装：将下载压缩包里的DefaultSettings文件夹复制到Axure安装目录下（如：C:\Program Files\Axure\Axure RP 9），然后将元件库文件Markdown文档.rplib导入Axure RP元件库即可；
2. 在线版安装：将元件库文件Markdown文档.rplib导入Axure RP元件库即可；
3. 使用：在Axure RP元件库选择Markdown文档（在线版）或Markdown文档（离线版）后，从里面将需要的元件拖到画布中，将Markdown文本输入到元件markdown_text输入框中即可；
4. 运行：在线版元件依赖网络资源运行，无外网访问将无法正常渲染文档。离线版无须依赖网络，可完全离线使用；
5. 附注：Markdown预览页面的样式是自动生成的，在Axure RP中除页面背景外，修改元件的大小、样式、颜色等样式并不会对其最终生成的效果产生影响，后续更新的元件版本可能会增加一些自定义样式的参数；
6. 其他：有建议或意见可与我邮件沟通；

2.2 语法案例（部分）

转载请注明：追风逐雨 » Markdown文档元件 For Axure RP 9/10