如何替换斯巴达克斯桌面图标



当我们导航到新的SAP Spartacus网站时,由于应用程序的PWA性质,我们可以选择在我们使用的设备上安装应用程序。当安装应用程序时,会使用Spartacus代码中提供的默认图标,我可以在Spartacus的代码中看到这个文件的来源:

\js storefront\mymobilestore\src\assets\icons

使用的Spartacus代码中的文件名为"icon-128x128.png",我可以在以下文件中看到该文件被引用:

\js storefront\mymobilestore\src\manifest.webmanifest

这是我找到这个图标文件的参考:

"图标":[{"src":"assets/icons/icon-72x72.png";,"尺寸":"72x72";,"类型":"image/png";,"目的":"可掩蔽的任何";},{"src":"assets/icons/icon-96x96.png";,"尺寸":"96x96〃;,"类型":"image/png";,"目的":"可掩蔽的任何";},{"src":"assets/icons/icon-128x128.png";,"尺寸":"128x128";,"类型":"image/png";,"目的":"可掩蔽的任何";},{"src":"assets/icons/icon-144x144.png";,"尺寸":"144x144";,"类型":"image/png";,"目的":"可掩蔽的任何";},

我们希望将您在设备上安装Spartacus时使用的默认图标替换为反映我们公司的自定义图标。我想这就像简单地把我们的自定义图标放在。。\js storefront\mymobilestore\src\assets\icons文件夹,然后更新引用该文件的manifest.webmanifest文件的区域。不幸的是,这对我来说不起作用,因为斯巴达克斯的原始图标仍在使用。

有人能告诉我我做错了什么吗?如何替换在设备上安装Spartacus应用程序时使用的默认图标?

我自己解决了这个问题。事实证明,安装在我桌面上的图标并不是我认为的源代码中的图标。

在最初替换图标文件时,我发现实际的文件被用作桌面图标,我可以看到该文件的大小是128x128。我很自然地认为我所需要做的就是替换源代码中的icon-128x128.png文件,这样就可以了,但事实并非如此。

最后,我用合适大小的不同图标替换了每个开箱即用的图标,并用每个新文件的名称更新了manifest.webmanifest文件。在部署了我的代码并在桌面上安装了Spartacus之后,我可以看到72x72大小的图标文件正在使用。

我发现以下网站在描述PWA应用程序的安装图标时非常有用:https://javascript.plainenglish.io/app-icons-in-a-pwa-8fb775207ad7

我希望这能帮助其他人!

最新更新