简介
chin-plugin-favicons 是一款基于 Node.js 的 npm 包，可以帮助前端开发人员生成网站的 favicon 图标。
安装
在项目目录下使用 npm 命令进行安装：
npm install chin-plugin-favicons --save-dev
使用
命令行调用
在项目根目录下执行以下命令：
npx chin-plugin-favicons -i icon.png -o ./dist/favicon -n "My Site Name" -d "My Site Description"
参数说明：
-i：输入图标的路径，支持 PNG、SVG、JPG 格式。-o：输出文件夹路径，输出的图标文件将以此作为根目录。-n：网站名称，用于生成 title 和 apple-touch-icon。-d：网站描述，用于生成 description 和 theme-color。
在 Webpack 中使用
在 Webpack 配置文件中引入 chin-plugin-favicons：
-- -------------------- ---- -------
----- ------------------ - --------------------------------
-------------- - -
-------- -
--- --------------------
----- ------------------
------- -----------
-------- --- ---- ------
--------------- --- ---- -------------
----------- -------
------------ ------
--
-
--参数说明：
logo：输入图标的路径，支持 PNG、SVG、JPG 格式。prefix：输出文件夹路径，输出的图标文件将以此作为根目录。appName：网站名称，用于生成 title 和 apple-touch-icon。appDescription：网站描述，用于生成 description 和 theme-color。background：生成的 apple-touch-icon 和 safari-pinned-tab.svg 的背景色。theme_color：网站主题色，用于生成 theme-color。
示例
-- -------------------- ---- -------
----- ------------------ - --------------------------------
-------------- - -
-------- -
--- --------------------
----- ------------------
------- -----------
-------- --- ---- ------
--------------- --- ---- -------------
----------- -------
------------ ------
--
-
--总结
通过使用 chin-plugin-favicons，我们可以很方便地生成网站的 favicon，从而提升用户体验，为网站增色不少。在使用过程中，需要注意配置参数的设置，以生成符合预期的图标。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60065f70238a385564ab66ea