VSCode支持图片内联预览，可通过双击打开、命令面板调用、安装Image Preview扩展或配置files.associations设置实现，默认启用需添加对应格式映射。

如果您在使用 VSCode 编辑代码或文档时，希望直接在编辑器内查看图片文件内容而非依赖外部程序打开，则可能是由于未启用或未正确配置图片预览功能。以下是实现此功能的多种方法：

本文运行环境：MacBook Air，macOS Sequoia。

一、启用内置图片预览功能

VSCode 自 1.80 版本起默认支持常见图片格式（如 PNG、JPEG、GIF、SVG）的内联预览，无需插件，但需确保文件以正确方式打开。

1、在资源管理器中双击目标图片文件（例如 logo.png）。

2、确认该文件在编辑器主区域以只读形式打开，并显示缩略图与尺寸信息。

3、若仅显示二进制内容，请右键点击编辑器标签页，选择Reopen with Editor，再选择Image Preview。

二、通过命令面板触发预览

当图片处于未激活状态或被其他编辑器模式占用时，可通过命令面板强制调用图像预览模块。

1、按下 Cmd+Shift+P（macOS）或 Ctrl+Shift+P（Windows/Linux）打开命令面板。

2、输入并选择Open Preview to the Side。

3、确认当前活动编辑器中已打开图片文件，否则命令将不可用或提示无有效目标。

三、安装 Image Preview 扩展（第三方）

部分用户需要更丰富的交互能力（如缩放、旋转、导出），可借助社区扩展增强原生功能。

1、点击左侧活动栏的扩展图标（四个方块组成的图标）。

2、在搜索框中输入Image Preview，找到作者为 kisstkondoros 的扩展。

3、点击Install 按钮完成安装，无需重启即可生效。

四、调整设置以默认启用图片预览

避免每次手动切换编辑器模式，可通过修改用户设置使图片文件自动以预览方式打开。

1、打开设置界面（Cmd+, 或通过菜单 Code > Settings）。

2、搜索关键词files.associations，点击右侧的编辑图标进入 settings.json。

3、添加如下配置项："*.png": "image", "*.jpg": "image", "*.jpeg": "image", "*.gif": "image", "*.svg": "image"。