确保您机器上已安装 Node >=16。
警告
请勿使用不均匀版本的 Node，例如 19、21、23 等。 这些版本尚未经过 Quasar 测试，并且由于其实验性，通常会导致问题。 我们强烈建议始终使用 Node 的 LTS 版本。
您将全局安装 Icon Genie CLI。 您无需在项目文件夹中安装它。
# Node.js >=18 is required.
$ yarn global add @quasar/icongenie这将安装 icongenie 命令行工具。
Windows 开发人员注意
如果您遇到类似“pngquant 构建失败”的错误，那么您还需要全局安装 windows-build-tools（“yarn global add windows-build-tools”或“npm install --global windows-build-tools”）。 然后转到 C:\Users\<windows_username>\.windows-build-tools 并运行 vs_BuildTools.exe。 从那里选择 npm/yarn 和 python 进行安装。 完成此步骤后，您可能需要重新启动机器，否则您现在可以安装 @quasar/icongenie。
安装提示
如果您使用的是 Yarn，请确保 Yarn 全局安装位置 位于您的 PATH 中
# in ~/.bashrc or equivalent
export PATH="$(yarn global bin):$PATH"在 Windows 下，修改用户的 PATH 环境变量。 如果您使用的是 yarn，请添加 %LOCALAPPDATA%\yarn\bin，否则如果您使用的是 npm，请添加 %APPDATA%\npm。
升级到 Icon Genie v2
本节适用于那些一直使用 Icon Genie v1 现在正在升级到 Icon Genie v2 的用户。
NPM 包名称更改
版本 1 是一个 Quasar 应用程序扩展，因此您将其安装到您的项目文件夹中。 新版本 (v2) 无需在本地安装，因为它是在全局安装的。 您的 CI/CD 不需要它，因为它是一个一次性过程，输出文件 (图像) 将直接添加到您的项目文件夹中。
因此，请从您的项目文件夹中卸载 Icon Genie v1
# from your Quasar CLI project folder:
$ quasar ext remove @quasar/icon-genie输入文件
在版本 1 中，您需要有一个 app-icon.png 和一个 app-splashscreen.png（具有固定宽度和高度）。 在版本 2 中不再是这种情况。 您现在只需要一个带有透明度的 png 文件（其名称可以是任何东西），最小尺寸为 64x64 px（但越高越好！ – 推荐最小尺寸：1024x1024）作为图标，然后是另一个可选的 png（任何名称）作为启动屏幕的背景（最小 128x128 px，但推荐最小尺寸为 1024x1024 px）。
启动屏幕的工作方式也完全不同。 它们将使用图标在可选背景之上生成。 图标与宽度或高度（以较低者为准）的尺寸比例可以通过 CLI 参数 (--splashscreen-icon-ratio) 进行调整。 您甚至可以告诉 Icon Genie 比例为 0，这样它就不会在背景之上添加图标。
输出文件
我们改进了生成的图标和启动屏幕列表，以匹配最新的标准并避免重复。 因此，您会注意到一些旧文件不再生成，而一些文件则是全新的。 Icon Genie 现在会告诉您需要添加哪些标签（如果有）到您的 /index.html 或 /src/index.template.html 中（您可以复制粘贴标签并替换旧标签）– 所以请注意标签列表。
删除所有当前的图标/启动屏幕文件并让 Icon Genie 重新执行其操作可能是个好主意。 这样，您可以确保您保留的只是实际在 Quasar 应用程序中使用的内容。
Icon Genie v2 中的新功能
Icon Genie v2 是从上到下完全重写的。
- Icon Genie 现在是一个独立的 CLI，不再是 Quasar 应用程序扩展。
- 输入文件（图标和背景）可以有任意名称，可以放置在任何地方，并且不需要具有固定的宽度和高度。 从 v2.1 开始，图标输入文件不需要具有相同的宽度和高度。 此外，图标输入文件现在会自动修剪。
- 您现在可以配置图标输入文件的填充。 (v2.1+)
- 我们改进了生成的图标和启动屏幕列表，以匹配最新的标准并避免重复。
- 启动屏幕以更好的方式创建，图标位于背景之上（图标具有您想要的任何尺寸比例，包括 0，这意味着：“我只想要没有图标的背景图像”）
- 新命令：generate、verify 和 profile，每个命令都有自己的用途。
generate命令现在还会显示您在/index.html或/src/index.template.html文件中需要的标签。verify命令甚至可以检查每个文件是否位于正确的位置，以及其宽度是否与高度匹配。- 许多新参数：质量、svg-color、png-color、splashscreen-color、splashscreen-icon-ratio 等。 查看 命令列表 页面。
- 您现在可以单独控制每种类型的资产（ico、png、启动屏幕等）的每个 Quasar 模式，每个模式都有其自己的设置/参数。 检查
--filter、--quality和所有颜色参数。.ico文件的一个很好的用例是。 - 现在可以通过 Icon Genie 配置文件 进行自动化。
- 现在你可以使用 Icon Genie API 通过 配置文件 生成自己的自定义图像文件。
最后，我们需要再次强调 quality 参数，它将决定图像的清晰度和大小（KB）。