简介
cc-grunticon-lib 是一个用于 Grunt 构建工具的插件，它能够将 SVG 图标转换为 CSS 样式表和 PNG 文件。该插件支持处理多种图标格式、复杂的 SVG 动画效果以及自定义的输出路径和文件名。
安装
在使用之前，需要先安装 Node.js 和 Grunt 构建工具。安装完成后，在命令行中执行以下命令安装 cc-grunticon-lib：
--- ------- ---------- ----------------
使用
配置 Gruntfile.js
首先，在项目根目录下创建一个 Gruntfile.js 文件，用于配置 Grunt 的任务。在该文件中，需要引入 cc-grunticon-lib 插件，并指定相关参数：
-------------- - --------------- -
---------------------------------------
------------------
---------- -
-------- -
------ --
------- -----
---- ---------
---- ----------
----- ---------
---
-------- -
----------- ------------
----------- ----------------
---------- ----------------
------------ --------------
-
-
-
---
----------------------------- ---------------
--上述配置中，expand、cwd 和 src 属性指定了待处理的 SVG 图标所在的目录和文件名规则，而 dest 属性则指定了输出路径。options 属性则用于指定一些转换的细节，如生成的 CSS 样式表文件名、PNG 文件名等。
运行任务
在命令行中执行以下命令运行 Grunt 任务：
-----
执行成功后，即可在输出路径中看到生成的 CSS 样式表和 PNG 文件。
示例代码
以下是一个简单的 SVG 图标示例，它包含两个路径元素，分别表示一个圆和一个正方形：
---- ---------- - --- ---- ----------------------------------- ----- --------- ------ ------ - --- ---- ------ - --- ------ ------------- ----- ------------- ---- --- --- -- ------------- ------
将该代码保存为 icons/example.svg 文件，然后在 Gruntfile.js 中添加以下配置：
-------------- - --------------- -
---------------------------------------
------------------
---------- -
-------- -
------ --
------- -----
---- ---------
---- ----------
----- ---------
---
-------- -
----------- ------------
----------- ----------------
---------- ----------------
------------ --------------
-
-
-
---
----------------------------- ---------------
--最后，在命令行中执行 grunt 命令即可生成输出文件。打开 output/preview.html 文件，可以看到 SVG 图标已经被转换为了 CSS 样式表和 PNG 文件，并且可以在网页中使用它们：
--------- -----
------
------
---------------- ---------------
------ ----------------
------ -
-------- -------------
------ ----
------- ----
--------------- -------
------------------ ----------
-------------------- ------ -------
-
------------ - ----------------- --------------------- ---------------- ---- ----- -
------------ - ----------------- --------------------- ---------------- ---- ----- -
--------
-------
------
------------- ------------
------- --- ---- --------
----------------------------------------------------------- ----------
---------------------------------------------------------------------------------------