VSCode需借助插件或命令查看图片尺寸:推荐安装Image Preview插件,打开图片即可在预览窗格顶部显示宽高、格式、大小等;也可用终端命令file或identify(需ImageMagick);1.85+版本支持资源管理器悬停显示基础信息。

VSCode 本身不内置图片尺寸查看功能,但可以通过插件和简单操作快速获取图片的宽高、格式、大小等基本信息。
安装 Image Preview 插件
这是最常用、轻量且无需外部依赖的方案:
- 在扩展市场(Ctrl+Shift+X)搜索 Image Preview(作者:kisstkondoros)
- 点击安装并重启 VSCode(部分版本无需重启)
- 打开任意图片文件(如
logo.png),右侧会自动显示预览窗格,顶部即显示Width × Height(例如1200×800)、格式(PNG/JPEG)、文件大小(如245.6 KB)和完整路径
使用命令面板查看基础属性
不装插件也能快速获知尺寸(仅限部分格式,如 PNG、JPEG、GIF):
中国地图网点分布情况提示查看特效JS代码,网点标注内容可以放图片、地址、电话信息,通常用在 公司网点全国分布点查询,例如快递网点、分公司网点,还是很实用的功能,基于jQuery实现。
- 右键点击图片文件 → 选择 Copy Path 或直接拖入终端
- 在集成终端中运行(需系统支持
file命令,macOS/Linux 默认有,Windows 需安装 Git Bash 或 WSL):file -i your-image.jpg(查看 MIME 类型)identify your-image.png(需先安装 ImageMagick) - 输出示例:
your-image.png PNG 1920x1080 1920x1080+0+0 8-bit sRGB 2.1MB 0.000u 0:00.000→ 宽高即1920x1080
启用内置资源管理器悬停提示(有限支持)
VSCode 1.85+ 版本对部分图片格式增加了悬停信息:
- 在资源管理器中将鼠标悬停在图片文件名上
- 几秒后会弹出 tooltip,显示文件大小、修改时间,部分 PNG/JPEG 也会附带分辨率(取决于系统图像库支持程度)
- 该功能无需配置,但信息较简略,不能替代插件
基本上就这些。日常开发推荐装 Image Preview,零配置、响应快、信息全,连 SVG 和 WebP 都支持。









