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):
功能介绍: 一.系统管理:管理员管理,可以新增管理员及修改管理员密码;数据库备份,为保证您的数据安全本系统采用了数据库备份功能;上传文件管理,管理你增加产品时上传的图片及其他文件 二.企业信息:可设置修改企业的各类信息及介绍 三.产品管理:产品类别新增修改管理,产品添加修改以及产品的审核 四.下载中心:可分类增加各种文件,如驱动和技术文档等文件的下载 五.订单管理:查看订单的详细信息
- 右键点击图片文件 → 选择 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 都支持。









