Markdown Image 插件

一、前言

有时候写Markdown插入图片时，通常都是直接复制粘贴过来，但是复制粘贴过来的图片，往往都会被默认放到与Markdown文件同目录下，如果想要规范性地放图片，那就很麻烦了。

所以这个插件就是解决了这个问题。

二、安装

打开vscode，在左侧栏打开扩展，然后搜索：Markdown Image，作者 Hancel Lin。

图 0

下载好了以后，点开它的设置，就有很多的设置项，有中文版。

图 1

图 2

可以根据自己的需要去设置，这里仅展示我的目标用法。

三、目标

  • 快捷键设置为 Ctrl+Shift+V 触发
  • 实现按下快捷键后，图片自动被放在与当前 Markdown 文件同名的文件夹下，且该文件夹与Markdown文件在同一个目录下
  • 命名方式为：<markdown文件名>-<时间戳>.png
  • 图片自动标注：图 1 ，图 2，图 3…
  • 存放图片的文件夹不存在则自动创建

四、实践

1、键位更改

先直接按 Ctrl+Shift+P 组合键，呼出命令面板，输入Key，然后打开 首选项：打开键盘快捷方式

图 3

进去后，搜索 Markdown Image 找到粘贴图片的选项

图 4

然后对键绑定双击一下，会弹出一个更改快捷键提示框，根据提示更改即可。

2、粘贴事件

直接按 Ctrl+Shift+P 组合键，输入settings，点击打开用户设置。

图 6

在打开的JSON文件，滑动到最底部，然后在最后一个花括号 } 之前，加入以下内容：

1
2
"markdown-image.local.path": "./",
"markdown-image.base.fileNameFormat": "${mdname}/${mdname}-${timestamp}"

如图所示，注意最后的花括号的位置，还有前边的条目最后那里如果没有逗号，需要加上：

图 7

3、完成

Ctrl+S 保存好配置以后，随意复制一张图片，回到markdown里面按你设定的快捷键，这里以刚刚的 Ctrl+Shift+V 为例，粘贴后会出现：

图 8

这样是正常的，别看像乱码，你可以打开你的markdown文件所在位置，看是不是多了一个文件夹，并且里面存放了你刚刚截图上传markdown的图片。
图 9

到这一步就成功了。

五、注意事项

不要试着自己用Ctrl+V来当快捷键，虽然这不影响插件的功能，但是会影响你粘贴正常的文本内容，这也是为什么笔者这里使用 Ctrl+Shift+V 的方案