Image Preview
鼠标悬停在代码中的图片路径上时，自动预览图片。
功能特性
- 悬停预览 - 鼠标移到图片路径上即可预览
- @image: 格式 - 支持
@image:image.png 格式
- 智能搜索 - 自动搜索整个工作区查找图片
- base64 编码 - 兼容 SSH 远程连接
- 工作区配置 - 每个工作区独立配置
安装
VSCode 中：扩展 → ... → 从 VSIX 安装
配置
按 Ctrl+Shift+P 打开命令面板，输入以下命令：
| 命令 |
功能 |
Image Preview: 添加搜索目录 |
添加额外搜索目录 |
Image Preview: 删除搜索目录 |
删除已添加的目录 |
Image Preview: 查看当前配置 |
显示当前配置信息 |
或在 .vscode/settings.json 中手动配置：
{
"imagePreview.searchDirectories": ["images", "assets"],
"imagePreview.supportedExtensions": [".png", ".jpg", ".jpeg", ".gif", ".bmp", ".webp", ".svg", ".ico"],
"imagePreview.maxWidth": 600,
"imagePreview.maxHeight": 400
}
配置说明
| 配置项 |
类型 |
默认值 |
说明 |
searchDirectories |
array |
[] |
图片搜索目录列表（相对于工作区） |
supportedExtensions |
array |
全部格式 |
支持的图片格式 |
maxWidth |
number |
600 |
预览最大宽度（像素） |
maxHeight |
number |
400 |
预览最大高度（像素） |
支持的代码格式
# @image: 格式
img = "@image:image.png"
img = '@image:photo.jpg'
# 字符串路径
img = "logo.png"
img = 'photo.jpg'
# Python PIL/OpenCV
Image.open("test.png")
cv2.imread("camera.jpg")
图片搜索顺序
- 绝对路径
- 相对于当前文件
- 相对于工作区根目录
- 在配置的搜索目录中查找
- 递归搜索整个工作区
版本历史
- v1.2.0 - 使用 settings.json 配置
| |
