地址:点击前往。url:https://markdown.buxiantang.top/
这是我使用Arya开源项目自行部署,这是一款基于 Vue、Vditor,为未来而构建的在线 Markdown 编辑器;轻量且强大:内置粘贴 HTML 自动转换为 Markdown,支持流程图、甘特图、时序图、任务列表,可导出携带样式的图片、PDF、微信公众号特制的 HTML 等等。
我的所有markdown文件都是在这里编写,好的一点是只要不强制刷新或者删除内容,本地内容不会丢失。
什么是 Markdown
Markdown 是一种方便记忆、书写的纯文本标记语言,用户可以使用这些标记符号,以最小的输入代价,生成极富表现力的文档:譬如您正在阅读的这份文档。它使用简单的符号标记不同的标题,分割不同的段落,粗体、斜体 或者超文本链接,更棒的是,它还可以:

  1. 制作待办事宜 Todo 列表
    🎉 通常 Markdown 解析器自带的基本功能;
    🍀 支持流程图、甘特图、时序图、任务列表;
    🏁 支持粘贴 HTML 自动转换为 Markdown;
    💃🏻 支持插入原生 Emoji、设置常用表情列表;
    🚑 支持编辑内容保存本地存储,防止意外丢失;
    📝 支持实时预览,主窗口大小拖拽,字符计数;
    🛠 支持常用快捷键(Tab),及代码块添加复制
    ✨ 支持导出携带样式的 PDF、PNG、JPEG 等;
    ✨ 升级 Vditor,新增对 echarts 图表的支持;
    👏 支持检查并格式化 Markdown 语法,使其专业;
    🦑 支持五线谱、及部分站点、视频、音频解析;
    🌟 增加对所见即所得编辑模式的支持(⌘-⇧-M);
    点我展开看代码

  2. 书写一个质能守恒公式[^LaTeX]

  3. 高亮一段代码[^code]
    // 给页面里所有的 DOM 元素添加一个 1px 的描边(outline);
    [].forEach.call($$(""),function(a){
    a.style.outline="1px solid #"+(~~(Math.random()
    (1<<24))).toString(16);
    })

  4. 高效绘制流程图
    graph TD;
    A-->B;
    A-->C;
    B-->D;
    C-->D;

  5. 高效绘制序列图
    sequenceDiagram
    participant Alice
    participant Bob
    Alice->John: Hello John, how are you?
    loop Healthcheck
    John->John: Fight against hypochondria
    end
    Note right of John: Rational thoughts
    prevail...
    John-->Alice: Great!
    John->Bob: How about you?
    Bob-->John: Jolly good!

  6. 高效绘制甘特图
    甘特图内在思想简单。基本是一条线条图,横轴表示时间,纵轴表示活动(项目),线条表示在整个期间上计划和实际的活动完成情况。它直观地表明任务计划在什么时候进行,及实际进展与计划要求的对比。

gantt
title 项目开发流程
section 项目确定
需求分析 :a1, 2019-06-22, 3d
可行性报告 :after a1, 5d
概念验证 : 5d
section 项目实施
概要设计 :2019-07-05 , 5d
详细设计 :2019-07-08, 10d
编码 :2019-07-15, 10d
测试 :2019-07-22, 5d
section 发布验收
发布: 2d
验收: 3d
7. 支持图表
Tip

可能在博客内无法正常预览

显示效果应该是这样:
显示效果

点我展开看代码
备注:上述 echarts 图表📈,其数据,须使用严格的 JSON 格式;您可使用 JSON.stringify(data),将对象传换从而得标准数据,即可正常使用。

  1. 绘制表格
    作品名称 在线地址 上线日期
    导航页 https://nav.buxiantang.top/ 2024-07
    卜仙堂 https://buxiantang.top/ 2024-05
    Markerdown https://markdown.buxiantang.top/ 2024-07
  2. 折叠代码块
点我展开看代码

# 在这里写折叠的代码
  
10. 更详细语法说明 想要查看更详细的语法说明,可以参考这份 [Markdown 资源列表](https://github.com/nicejade/nice-front-end-tutorial/blob/master/tutorial/markdown-tutorial.md),涵盖入门至进阶教程,以及资源、平台等信息,能让您对她有更深的认知。

总而言之,不同于其它所见即所得的编辑器:你只需使用键盘专注于书写文本内容,就可以生成印刷级的排版格式,省却在键盘和工具栏之间来回切换,调整内容和格式的麻烦。Markdown 在流畅的书写和印刷级的阅读体验之间找到了平衡。 目前它已经成为世界上最大的技术分享网站 GitHub 和 技术问答网站 StackOverFlow 的御用书写格式,而且越发流行,正在在向各行业渗透。

最新更新于 204.7.18

❤️ 转载文章请注明出处,谢谢!❤️