用VsCode优雅写MarkDown

插件推荐

  • Markdown All in One

    快捷键 作用
    Ctrl + B 加粗
    Ctrl + I 斜体
    Alt + S 删除线
    Ctrl + ] 增加缩进
    Ctrl + [ 减少缩进
    Ctrl + Shift + ] 标题升级
    Ctrl + Shift + [ 标题降级
    Alt + C 勾选/取消勾选任务列表
    Ctrl + M 数学环境
    Alt + Shift + F 表格格式化
    Ctrl + K V 打开预览窗口
    Ctrl + Shift + V 打开新的预览窗口

    任务列表语法

    • 任务列表格式：- [ ] 任务名
    • 任务列表勾选：- [x] 任务名
    • 生成目录：Ctrl+Shift+P，输入Markdown All in One: TOC
    • 给标题生成序号：Ctrl+Shift+P，输入add section numbers

  • markdownlint

    • 设置格式化程序：文档中右键【使用 ... 格式化文档】-【配置默认格式化程序】选择 markdownlint
    • 快捷键
      • 查看打开的所有 Tab 标签文档中语法警告：Ctrl+Shift+M
      • 查看当前位置警告信息：F8

  • Markdown Preview Enhanced：官方文档

  • Pangu-Markdown：自动在中英文之间插入空格

    • 方法一：Ctrl+Shift+P，输入Pangu Format

    • 方法二：在用户 JSON 配置文件中配置

      "pangu.auto_format_on_save": true

图片粘贴

下面我使用 Paste Image 插件和内置的 copyFiles 功能进行配置（个性化低）

Paste Image

// 用 Paste Image 配置图片
// 设置粘贴图片时的默认文件名格式为 年-月-日-时-分-秒
"pasteImage.defaultName": "Y-MM-DD-HH-mm-ss",
// 设置图片保存路径为当前文件所在目录下的 assets/当前文件名(不含扩展名) 文件夹
"pasteImage.path": "${currentFileDir}/assets/${currentFileNameWithoutExt}",
// 设置插入图片的 Markdown 语法格式
"pasteImage.insertPattern": "![${imageFileName}](${imageFilePath})",

copyFiles

缺点是不可以更改保存图片的文件名

// 配置 MarkDown 文档插入图片自动保存到文件所在目录的 assets/${documentBaseName} 下
"markdown.copyFiles.destination": {
  "*.md": "assets/${documentBaseName}/"
}

最后

// ============================================MarkDown============================================
"[markdown]": {
  "diffEditor.ignoreTrimWhitespace": true, // 在差异编辑器中忽略空格差异
  "editor.formatOnSave": true, // 保存时自动格式化文档
  "editor.defaultFormatter": "DavidAnson.vscode-markdownlint", // 设置默认的 Markdown 格式化工具
  "editor.minimap.enabled": false, // 关闭编辑器右侧的小地图以减少视觉干扰
  "editor.glyphMargin": false, // 关闭字形边距以获得更简洁的编辑界面
  "editor.renderWhitespace": "all" // 显示所有空白字符，方便查看和编辑空格、制表符等
},
// 配置 markdownlint 配置
"markdownlint.config": {
  // 格式化代码块允许 $ 开头
  "MD014": false,
  // 允许多个一级标题
  "MD025": false,
  // 允许图片标签alt为空
  "MD045": false
},
// 用 Paste Image 配置图片
// 设置粘贴图片时的默认文件名格式为 年-月-日-时-分-秒
"pasteImage.defaultName": "Y-MM-DD-HH-mm-ss",
// 设置图片保存路径为当前文件所在目录下的 assets/当前文件名(不含扩展名) 文件夹
"pasteImage.path": "${currentFileDir}/assets/${currentFileNameWithoutExt}",
// 设置插入图片的 Markdown 语法格式
"pasteImage.insertPattern": "![${imageFileName}](${imageFilePath})",

// 配置 MarkDown 文档插入图片自动保存到文件所在目录的 assets/${documentBaseName}.assets 下，插入的图片的文件是时间戳
"markdown.copyFiles.destination": {
  "*.md": "assets/${documentBaseName}/"
}
// ============================================MarkDown============================================

参考

posted @ 2024-11-30 20:44  ming_zero  阅读(456)  评论(0)    收藏  举报