【vscode】vscode paste image插件设置

本文首发于 ❄️慕雪的寒舍

vscode编辑md文件的时候,如果想插入图片,自带的粘贴只会粘贴到当前目录下,也没有文件重命名,很不友好。

在扩展商店里面有mushan的Paste Image插件,相比自带的,更加友好一点。但是它的配置把我弄糊涂了,简单测试了一下才明白处理的逻辑。

注意,本文编写的是对mushan的Paste Image插件的教程。

首先是安装这个插件,这个不多说,然后进入插件设置。我这里说明一下每一个设置项的作用,只列出了需要修改的配置项。

注意:该插件的粘贴图片快捷键是CTRL+ALT+V

设置项 作用 示例配置 说明
Base Path 基础目录 ${currentFileDir} 该项相当于粘贴文件的时候,应该把什么目录视作工作目录,最终图片路径会以这个path来计算相对路径;currentFileDir就是当前工作区文件的路径,所以不需要修改这个配置。
Default Name 图片文件名 Y-MM-DD-HH-mm-ss 粘贴后的图片文件名,可以根据当前时间格式化命名。注意这里不要添加其他非格式化项,不然容易命令出错。
Name Prefix 图片文件名前缀 留空 该项是图片文件名的前缀,比如设置为image-,则粘贴的图片文件名前面会带上image-
Name Suffix 图片文件名后缀 留空 该项是图片文件名的后缀,设置效果同上。(文件名后缀是在文件扩展名之前的)
Path 图片文件保存位置 ${currentFileDir} 图片文件会保存的目录,根据你的需要修改;
Prefix 最终文件路径的前缀 留空 最终文件路径的前缀,建议设置为./
Suffix 最终文件路径后缀 留空 最终文件路径的后缀,不建议添加值,否则会因为扩展名被覆盖而影响解析;

根据我的需要,我需要将图片粘贴到当前md文件所在目录下的img路径中,那么我就需要修改Path和Prefix两个配置项

项目 设置
Path ${currentFileDir}/img/
Prefix ./

如果你不设置Prefix,最终粘贴的图片路径如下

复制代码
![](img/image-20240124161634.png)

对于绝大部分markdown软件,这个路径都能被正常识别为相对路径并访问到图片。但是对于我正在使用的vuepress框架而言,必须将图片路径添加上./他才能识别出来

复制代码
![](./img/image-20240124160742.png)

设置了Prefix之后就没有问题了!

这个插件还是很好用的,如果你发现某些设置不生效,可以重启vscode或者重新写入配置项试试(我就遇到过,玄学问题)。

相关推荐
●VON5 小时前
鸿蒙 PC Markdown 编辑器存储安全:AtomicFile 原子提交与故障注入
安全·华为·编辑器·harmonyos·鸿蒙
●VON14 小时前
鸿蒙 PC Markdown 编辑器 Alpha 评审:如何用退出条件判断阶段完成
网络·安全·华为·编辑器·harmonyos·鸿蒙
MGS浪疯14 小时前
我用 WorkBuddy 做了一个能记住前文的 AI 小说编辑器
人工智能·编辑器·腾讯云·腾讯云ai代码助手·workbuddy开发者分享季·codebuddy开发者分享季
●VON15 小时前
鸿蒙 PC Markdown 编辑器 Bridge 协议:原生外壳与 Web 内核的状态同步
前端·华为·编辑器·harmonyos·鸿蒙
Irene19911 天前
怎么设置 PyCharm 使用 VSCode 的快捷键,推荐保留的原生快捷键(特色功能不建议覆盖,否则丧失效率优势)Ctrl+Alt+L:代码格式化
vscode·pycharm·快捷键
●VON1 天前
鸿蒙 PC Markdown 编辑器原生右键弹层兼容
安全·华为·编辑器·harmonyos·鸿蒙
放学校门口见1 天前
vscode部署stm32开发调试环境
ide·vscode·stm32
●VON1 天前
鸿蒙 PC Markdown 编辑器系统浏览器与图片查看器独立验收
华为·编辑器·harmonyos·鸿蒙
●VON1 天前
鸿蒙 PC Markdown 编辑器通信架构:受限 ArkTS-JavaScript Bridge
华为·架构·编辑器·harmonyos·鸿蒙
宁&沉沦1 天前
Chrome 扩展 Manifest 字段版本支持一览(全量)
前端·后端·编辑器