vs code不内置二维码预览功能,需保存为png/jpeg等支持格式后右键“open with”系统查看器或执行code qrcode.png命令预览;base64数据需粘贴至在线解码页验证,svg格式须另存为png方可预览。

VS Code 中生成的二维码怎么预览?
VS Code 本身不内置二维码预览功能,所谓“编辑二维码”通常指你用插件(如 QR Code Generator)生成了 QR 码图片或 Base64 数据,但没立刻看到效果——这不是 VS Code 卡了,而是它默认不渲染图像文件或不自动打开预览。
为什么右键「在浏览器中打开」可能失败?
常见错误现象:file:// 路径被浏览器拦截(尤其 Chrome)、生成的是临时内存数据(如 data:image/png;base64,...)、或插件只输出文本而非真实文件。
- 插件生成的是纯文本(比如一串 Base64),需手动粘贴到在线解码页(如
https://qr-code-generator.com/)验证 - 若生成了
.png文件但双击无反应,检查是否保存成功(路径里有中文/空格易出错) - 部分插件默认把二维码写入剪贴板——直接粘贴到微信、钉钉或桌面截图工具里就能扫码
最稳的三步实操法
不用装新插件,利用 VS Code 自带能力:
- 确保二维码已保存为真实文件(如
qrcode.png),且不在node_modules或隐藏目录下 - 在资源管理器中右键该文件 → 选择「Reveal in Explorer」→ 再右键 → 「Open with」选系统默认图片查看器(Windows 照片、macOS 预览)
- 或终端执行:
code qrcode.png(前提是已配置 CLI;VS Code 会以内置图片查看器打开)
注意:VS Code 内置图片查看器仅支持 PNG/JPEG/GIF,不支持 SVG 格式的二维码(有些插件默认导出 SVG,此时必须另存为 PNG 才能预览)










