让Windows 资源管理器可以直接预览SVG矢量图

传说中的暗暗

已于 2022-10-26 20:59:07 修改

阅读量4.6k

点赞数

分类专栏：图像视频处理 Windows 文章标签： windows svg

于 2022-10-26 16:02:46 首次发布

本文链接：https://blog.csdn.net/no1xium/article/details/127534041

版权

Windows 同时被 2 个专栏收录

93 篇文章 17 订阅

订阅专栏

图像视频处理

6 篇文章 0 订阅

订阅专栏

SVG文件的矢量图片在Windows中默认是无法直接预览的，安装了Inkscape也仅仅显示的是它自己的图标，因此我们需要安装一款SVG预览插件

SVG-Explorer-Extension

下载地址

本地下载：SVG-Explorer-Extension

# Github 地址
https://github.com/maphew/svg-explorer-extension/releases
# cnet 下载地址
https://download.cnet.com/SVG-Explorer-Extension/3000-2248_4-78237543.html

安装扩展

下载完后解压 svg-explorer-extension-32bit-64bit-exe.zip 一般我们执行安装X64版本就可以了

清理图标缓存

在cmd窗口中输入以下命令将图标缓存清空，并重启资源管理器。

TASKKILL /IM explorer* /F && DEL "%localappdata%\IconCache.db" /A && explorer.exe

再次启动浏览我们就可以直接预览SVG矢量图了

在这里插入图片描述

清理缓存后如果无法显示的也可以重启系统后再尝试查看。

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

传说中的暗暗

关注关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
让Windows 资源管理器可以直接预览SVG矢量图

SVG文件的矢量图片在Windows中默认是无法直接预览的，安装了Inkscape也仅仅显示的是它自己的图标，因此我们需要安装一款SVG预览插件。
复制链接

扫一扫

专栏目录

SVG文件预览工具SVG Explorer Extension.rar

09-04

软件介绍: SVG图片格式本地预览功能，安装后能够很方便地在本地文件夹中查看、浏览SVG格式资源文件。

SVG预览工具

01-29

本地预览SVG图片功能，方便本地文件夹中查看、浏览SVG格式资源

参与评论您还未登录，请先登录后发表或查看评论

实现svg图在Element+图片预览组件中显示

最新发布

qq_59517599的博客

04-28

584

在 Element UI 的 el-image-viewer 组件中，直接使用 SVG 图片作为源是不直接支持的，因为 el-image-viewer 主要用于查看常规图像格式如 JPG, PNG 等。然而，你可以通过一些变通方法来展示 SVG 图片。首先，你需要将 SVG 文本转换为一个可用的 Data URL。这可以通过编码 SVG 文本并将其格式化为 Data URL 来实现。这样就能实现即使手里只有svg图或文本也能用element组件预览它了。另外如果后端返回的是SVG文本可以这样来操作。

可以在windows下预览SVG文件 SVG Explorer Extension

sinat_38324690的博客

07-05

2858

在windows下查看svg文件需要用浏览器打开才能查看，如果要在几十个svg文件里找起来简直是灾难，但是只要下载一个SVG Explorer Extension就可以完美解决问题。

Windows SVG预览工具（SVG Explorer Extension）

徐站的春天

04-20

6617

SVG Viewer Extension for Windows Explorer：它是一款功能实用的SVG图片格式本地预览工具，有了它即可轻松的进行本地文件夹中查看和浏览SVG格式资源文件。解压svg-explorer-extension-32bit-64bit-exe.zip，安装X64位插件。Windows系统不支持在文件夹下直接预览svg图片，需要使用SVG扩展插件解决。（可选步骤）清理图标缓存。

20 个有用的 SVG 工具，提供更好的图像处理

10-30

1387

使用 SVG 的 viewBox 和 preserveAspectRatio，也就是下图所示的粉色线和橙色线，以及旁边的标尺，你可以在折腾的过程中学习到 SVG 坐标是如何工作的。如果你使用 Photoshop 作为你作品的图片编辑器，有时候你可以需要在 Photoshop 的 workspace 里边转换你的设计成 SVG，在 Photoshop 中有一个不支持的格式。上传你的图片，按比例缩小或改变间隔，旋转和重新着色，直到你得到一个漂亮的图案。你可以设置宽松效果，过度动画的持续时间，以及旋转的方向。

【中二少年工具箱】——svga预览工具

关注前端，关注原创

03-27

3802

前面有篇文章讲过基于echarts的大屏可视化一些基础概念，其中提到和动画相关的插件有：lottie、gsap、svga等，本篇文章的主题是svga，但不是技术硬文，只是向大家介绍我最近写的一款工具——svga预览工具。正版软件会一直免费，所以请大家放心使用博主开发的正版软件。如果软件被破解，绕过通行码直接登录，后续对宿主机造成一切后果，请使用者自行承担。大家多多支持博主的公众号，新开小号，需要多多关注，拜谢大家：或者。

windows explorer svg图像预览软件

12-10

一款开源的预览svg图形的软件小巧速度奇快无比非常好用和windws完全融合

Windows资源管理器浏览svg图片

forward_huan的博客

11-06

323

window系统在资源管理器浏览svg图片工具

Windows 资源管理器 预览svg缩略图插件

08-31

Windows资源管理器是操作系统中用于浏览、管理和组织文件的工具，但默认情况下并不支持SVG文件的缩略图预览，而是显示一个通用的浏览器图标。这在处理大量SVG图形时可能会造成不便，因为你无法快速直观地了解每个...

Windows直接预览SVG 32位64位都支持

12-20

这通常涉及到安装第三方软件，如IrfanView、XnView等，这些软件提供SVG的查看和预览功能，并且可以在Windows资源管理器中集成。 2. **使用Visual Studio Code**: 虽然Visual Studio Code是一款代码编辑器，但它也...

矢量图预览插件ai、psd、cdr、eps图片缩略图补丁

07-23

矢量图预览插件ai、psd、cdr、eps图片缩略图补丁

Windows下预览SVG图片扩展包

11-16

"Windows下预览SVG图片扩展包"是一个针对Windows 10用户的解决方案，它提供了一个补丁或插件，使得用户无需额外的图像编辑软件就能直接在文件资源管理器中预览SVG文件。这个扩展包通常包括适用于不同架构（x64和x86...

本地预览Svg图片.zip

04-06

SVG，全称Scalable Vector Graphics，是一种基于XML的矢量图像格式，广泛应用于网页设计、移动...理解SVG的工作原理和特性，选择合适的预览工具和编程方式，能帮助开发者更好地管理和利用SVG资源，提升设计和开发效率。

项目中引用svg图标，公共组件SvgIcon使用，注册全局组件，使用自定义插件注册全局组件

x_nweBorder01k的博客

08-04

1045

项目中引用svg图标，公共组件SvgIcon使用，注册全局组件，使用自定义插件注册全局组件

Windows系统查看svg缩略图插件

EchoLei的博客

07-12

1033

无

windows 预览SVG缩略图

weixin_30785593的博客

03-29

9831

安装扩展SVG Viewer Extension for Windows Explorer（官网地址） *部分win10没有效果需要清理缩略图配置缓存（记得重启下电脑）。参考链接https://www.thewindowsclub.com/rebuild-icon-clear-thumbnail-cache-windows-10。转载于:https://www.cnblogs.c...

vue使用svg矢量图

09-03

在Vue中使用SVG矢量图，你可以按照以下步骤进行配置： 1. 首先，确保你的项目中有一个存放SVG图标的文件夹，比如`src/icons`。在这个文件夹中，你可以存放所有的SVG图标文件。 2. 在你的组件中，使用`<svg-icon>`组件来引用SVG图标。可以通过设置`icon-class`属性来指定SVG图标的名称，通过设置`className`属性来修改SVG图标的样式，比如大小和颜色。例如，`<svg-icon icon-class="tree" className="需要修改的样式" />`。 3. 配置`vue.config.js`文件，添加以下代码片段到`chainWebpack`方法中： ```javascript chainWebpack(config) { config.module .rule('svg') .exclude.add(resolve('src/icons')) // 注意svg的存储地址 .end() config.module .rule('icons') .test(/\.svg$/) .include.add(resolve('src/icons')) // 注意svg的存储地址 .end() .use('svg-sprite-loader') .loader('svg-sprite-loader') .options({ symbolId: 'icon-[name]' }) .end() } ``` 这段代码的作用是配置Webpack，使其能够正确地加载和处理SVG图标。其中，`exclude`和`include`方法用于指定SVG图标文件的存放地址，`svg-sprite-loader`用于加载和处理SVG图标文件，并通过`symbolId`选项设置图标的ID。通过以上配置，你就可以在Vue项目中使用SVG矢量图了。123 #### 引用[.reference_title] - *1* *2* *3* [vue中如何使用svg](https://blog.csdn.net/weixin_47909202/article/details/123015710)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

“相关推荐”对你有帮助么？

非常没帮助
没帮助
一般
有帮助
非常有帮助

提交