问题标签 [svgo]

是否可以将 svgo 选项传递给 svgr/webpack 加载器？我想删除宽度和高度属性并保留视图框，默认情况下它会删除那些。

Fill 属性不会在最终输出中被删除，即使removeAttrs在.svgo.yml. 当尝试从传递给生成组件的道具更新填充时，这会导致问题，如下所示：

fill当我从图标组件中手动删除属性时，<Path>我可以通过道具更改填充。

.svgo.yml配置：

.svgrrc.yml

package.json用于从assets文件夹生成图标的脚本：

资产 SVG 之一：

生成的 React Native 图标组件示例：

回购链接：https ://github.com/jaksm/svgr-rn

使用 svgo 1.3.2 我曾经运行此命令：

svgo --pretty --disable={removeUnusedNS,removeUselessDefs,removeUselessStrokeAndFill} file.svg -o file.min.svg

我更新到 svgo 2.3.0，现在我得到：

错误：未知选项 '--disable={removeUnusedNS,removeUselessDefs,removeUselessStrokeAndFill}'

所以我尝试像这样创建一个 svgo.config.js ：

但我只是得到错误：

错误：找不到模块“svgo”

需要堆栈：C:\Users\jpprade\Documents\vrac\svgo.config.js C:\Users\jpprade\AppData\Roaming\npm\node_modules\svgo\lib\svgo-node.js C:\Users\jpprade\ AppData\Roaming\npm\node_modules\svgo\lib\svgo\coa.js C:\Users\jpprade\AppData\Roaming\npm\node_modules\svgo\bin\svgo

• 在 Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
• 在 Function.Module._load (internal/modules/cjs/loader.js:686:27)
• 在 Module.require (internal/modules/cjs/loader.js:848:19)
• 在需要（内部/模块/cjs/helpers.js:74:18）
• 在对象。(C:\Users\jpprade\Documents\vrac\svgo.config.js:1:34)
• 在 Module._compile (internal/modules/cjs/loader.js:955:30)
• 在 Object.Module._extensions..js (internal/modules/cjs/loader.js:991:10)
• 在 Module.load (internal/modules/cjs/loader.js:811:32)
• 在 Function.Module._load (internal/modules/cjs/loader.js:723:14)
• 在 Module.require (internal/modules/cjs/loader.js:848:19)

svgo 已安装（全球）

如何使用禁用（或不禁用）配置文件的这 3 个插件运行 svgo？

谢谢 ！

我想在 SVGO 中启用插件，但是按照github 页面中的说明将以下代码添加到 config.js时，运行 SVGO 时出现错误：

我在想上面的代码没有放在 config.js 中，但我不确定在哪里添加它。

我正在使用 svgo-loader 来优化svg图像，并为此使用默认配置。我想添加一些自定义配置，比如我不想从中删除viewBox，svg因为它使定义尺寸变得svg非常困难。

我从互联网上找到了以下解决方案......但它们都不起作用，而且我总是viewBox从svg.

config.yml 文件的内容

svgo.config.js 的内容

对于 configFile 解决方案，我觉得它只是没有选择给定的文件，因为如果我将提供错误的文件位置（或某些不存在的文件位置），它的工作方式与默认情况完全相同（我的期望是有一个错误类似...提供的文件错误）。

我对 IMGMIN-CLI 优化图像非常满意，但它删除了我的 SVG 文件的 viewbox 属性。我还想为没有它并且只有高度/宽度属性的 SVG 文件添加属性。

这是我从 package.json 运行的脚本

我会跑 npm run imgmin

然而，插件选项没有任何影响。具有 viewbox 属性的 SVG 文件已将其删除，而没有添加的则没有。

我无法弄清楚我错过了什么。

我需要在 package.json 的其他地方声明一些东西吗？

我正在研究 ReactJS 中的交互式解决方案，它允许人们平移和缩放 SVG，但是由于详细的 SVG，我遇到了性能问题（拖动或缩放时 SVG 卡顿）。我正在使用 Adob​​e Illustrator 和 Inkscape 来处理这些 SVG，但我注意到更大的 SVG 性能比更小的 SVG 更好，并决定研究为什么会发生这种情况。拖动 SVG 时是否有任何影响性能的 SVG 标签？我注意到当我放大时性能会变差，即使我简化了路径。

我已经搜索并应用了 SVG 优化（简化、SVGO、SVGOMG），似乎删除 clipPath 可以提高性能。

I'm migrating an older Gulp workflow to Laravel Mix, and having trouble getting the old cleanup of SVGs working properly.

Current package.json:

I've migrated all of our existing SVGO options (namely the overrides) to svgo.config.js:

Before attempting any cleanup on SVGs, we are copying them over to the public path first to do all the processing there:

At this point, it doesn't appear to be triggering SVGO at all as the file is copied as-is with the viewBox and role attributes still in place (default settings have both of these being removed).

I can't seem to find full and complete documentation over how to accomplish this, as other StackOverflow questions or GitHub issues are all incomplete, outdated, or only include a part of the solution (a portion of the code as it is used with Webpack but not Laravel Mix).

I've attempted trying to use Mix Imagemin, ImageminWebpackPlugin directly, and svgo loader in various ways but either issues preventing me from using them at all or the same issue with the SVGs not be processed at all.

Any help would be greatly appreciated!