前言
在现代 Web 前端开发中， SVG 图形已经成为了重要的一部分。通常，我们会使用图形编辑工具（如 Sketch、Adobe Illustrator 等）创建 SVG 图形，并在代码中使用它们。然而，使用这些工具创建的 SVG 图形，通常包含大量重复的代码，这可能导致加载时间过长以及占用更多的网络带宽。
Builder-SVG-Minifier 是一款基于 Node.js 的开源 npm 包，可以帮助我们对 SVG 文件进行压缩，减小文件大小，提高加载速度并节省网络带宽。在本文中，我们将介绍如何使用 Builder-SVG-Minifier。
安装
安装 Builder-SVG-Minifier 非常简单。我们只需要在终端中执行以下命令，即可安装该包：
--- ------- ---------- --------------------
使用
安装完成后，我们就可以开始使用 Builder-SVG-Minifier 了。下面是一个基本的示例：
----- ------ - --------------------------------
--------
-------- -
- ------------ ---- --
- ------------------ ---- --
- ------------ - ------ --------------- - -
-
-- ---- -- -
------------------
---在上面的示例中，我们首先引入了 builder-svg-minifier 包，并将其赋值给一个变量 svgmin。接着，我们调用了 svgmin() 方法来对一个 SVG 图像进行压缩处理。这个方法需要两个参数：
- 一个配置对象，用于指定我们需要使用的插件，以及这些插件的配置选项。
- 一个回调函数，用于获取压缩后的 SVG 数据。
在上面的示例中，我们使用了三个插件来对 SVG 文件进行压缩：removeTitle、removeUselessDefs 和 removeAttrs。这些插件可以帮助我们删除 SVG 文件中没有用的部分，从而降低文件大小。
最后，我们使用一个回调函数来获取压缩后的 SVG 数据，并将其输出到控制台中。
在实际项目中，我们可以将这个方法集成到我们的构建工具（如 Gulp、Grunt 等）中，并自动对所有的 SVG 文件进行压缩处理。
插件
Builder-SVG-Minifier 提供了许多插件，可以帮助我们对 SVG 文件进行压缩处理。这些插件包括：
1. removeTitle
用于删除 SVG 文件中的 title 元素。
-------- -------- -- ------------ ---- -- ---
2. removeDesc
用于删除 SVG 文件中的 desc 元素。
-------- -------- -- ----------- ---- -- ---
3. removeComments
用于删除 SVG 文件中的所有注释。
-------- -------- -- --------------- ---- -- ---
4. removeMetadata
用于删除 SVG 文件中的所有 metadata 元素。
-------- -------- -- --------------- ---- -- ---
5. removeUselessDefs
用于删除 SVG 文件中的无用的 defs 元素。
-------- -------- -- ------------------ ---- -- ---
6. removeEmptyAttrs
用于删除 SVG 文件中的空属性。
-------- -------- -- ----------------- ---- -- ---
7. removeHiddenElems
用于删除 SVG 文件中的隐藏元素。
-------- -------- -- ------------------ ---- -- ---
8. removeEmptyText
用于删除 SVG 文件中的空文本。
-------- -------- -- ---------------- ---- -- ---
9. removeEmptyContainers
用于删除 SVG 文件中的空的 g 和 svg 元素。
-------- -------- -- ---------------------- ---- -- ---
10. collapseGroups
用于折叠 SVG 文件中的 g 元素。
-------- -------- -- --------------- ---- -- ---
11. removeAttrs
用于删除 SVG 文件中指定的属性。
-------- -------- -- ------------ - ------ --------------- - -- ---
12. removeDimensions
用于删除 SVG 文件中的 width 和 height 属性。
-------- -------- -- ----------------- ---- -- ---
结语
Builder-SVG-Minifier 是一个非常实用的 npm 包，可以帮助我们对 SVG 文件进行压缩，从而减小文件大小，提高加载速度并节省网络带宽。在本文中，我们介绍了该包的使用方法以及各种插件。希望本文对您有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60066c8dccdc64669dde558e