当前位置: 首页 > news >正文

【论文技巧】Mermaid VSCode插件制作流程图保存方法

插流程图快点

利用Mermaid Preview插件自带功能

如果你的VSCode安装了支持导出图片的Mermaid预览插件(如 Mermaid Markdown Syntax Highlighting 等),可以按以下步骤进行:

  1. 打开Mermaid代码文件:在VSCode中打开包含Mermaid代码的 .md(Markdown)文件。Mermaid代码通常会被包裹在三个反引号 ```mermaid 和 ` ````之间。例如:
A
B
C
  1. 打开预览窗口:一般可以通过右键点击编辑区域,选择“Open Mermaid Preview” 或者使用特定的快捷键(具体快捷键可能因插件配置而异)来打开Mermaid图表的预览窗口。
  2. 导出图片:在预览窗口中,通常会有一个导出按钮(可能是一个下载图标),点击该按钮。你可以选择导出的图片格式,如PNG、SVG等,然后选择保存的位置,完成图片的下载。

使用命令行工具结合插件

若上述方法不可行,还可以借助命令行工具 mmdc(Mermaid CLI)来导出图片,步骤如下:

  1. 安装Mermaid CLI:首先要确保你已经安装了Node.js,因为 mmdc 是基于Node.js的工具。打开终端,运行以下命令来全局安装Mermaid CLI:
npm install -g @mermaid-js/mermaid-cli
  1. 生成图片:在终端中,使用以下命令将Mermaid代码文件转换为图片。假设你的Mermaid代码文件名为 example.mmd,你可以使用以下命令将其转换为PNG图片:
mmdc -i example.mmd -o example.png

其中,-i 后面跟的是输入的Mermaid代码文件路径,-o 后面跟的是输出的图片文件路径和文件名。
3. 获取Mermaid代码文件:如果你在VSCode中编写了Mermaid代码,可以将其复制到一个新的文本文件中,将文件扩展名改为 .mmd.mermaid,然后再使用上述命令进行转换。

截图方式

如果以上方法都不适用,还可以使用系统自带的截图工具(如Windows的截图快捷键 Win + Shift + S,Mac的 Command + Shift + 3Command + Shift + 4 等),直接截取预览窗口中的Mermaid图表。不过这种方式得到的图片质量可能会受屏幕分辨率等因素影响,并且不够灵活。

下载个使用 Markdown Preview Enhanced 插件

在这里插入图片描述

http://www.lryc.cn/news/540374.html

相关文章:

  • Unity 位图字体
  • 科技快讯 | DeepSeek推出NSA加速长上下文训练,xAI Grok系列将陆续开源,月之暗面发布Kimi Latest新模型
  • 网络安全 | 5G网络安全:未来无线通信的风险与对策
  • Linux 实操篇 组管理和权限管理、定时任务调度、Linux磁盘分区和挂载
  • 应用案例 | uaGate SI助力汽车零部件工厂将生产数据传输到MES
  • Android JNI的理解与使用。
  • fpga助教面试题
  • Git命令详解与工作流介绍:全面掌握版本控制系统的操作指南
  • 提升信息检索准确性和效率的搜索技巧
  • Qt 中使用 ffmpeg 获取采集卡数据录制视频
  • Python爬虫TLS
  • 【Linux AnolisOS】配置Linux固定ip地址。然后在Windows上连接使用linux中docker容器里的redis和nacos。
  • IDEA中查询Maven项目的依赖树
  • 【Ubuntu】GPU显存被占用,但显示没有使用GPU的进程
  • 【并发编程】Java并发编程核心包
  • Unity 淡入淡出
  • 完整的 LoRA 模型训练步骤:如何使用 Kohya_ss 进行 LoRA 训练
  • 视觉分析之边缘检测算法
  • git输错用户名或者密码
  • 【Unity Shader编程】之图元装配与光栅化
  • 以ChatGPT为例解析大模型背后的技术
  • 网页版的俄罗斯方块
  • Linux运维_Dockerfile_打包Moby-26.1.4编译dockerd环境
  • 数据中心储能蓄电池状态监测管理系统 组成架构介绍
  • layui.table.exportFile 导出数据并清除单元格中的空格
  • vue-指令
  • 跟着李沐老师学习深度学习(十三)
  • 鸿蒙与跨端迁移的重要性
  • 成员函数定义后面加const是什么功能:C++中const成员函数的作用
  • QSNCTF-WEB做题记录