PWA未根据manifest.json（Heroku上的Node.js）显示自定义图标_Heroku_Icons_Create React App_Progressive Web Apps_Manifest.json

PWA未根据manifest.json（Heroku上的Node.js）显示自定义图标

heroku

PWA未根据manifest.json（Heroku上的Node.js）显示自定义图标,heroku,icons,create-react-app,progressive-web-apps,manifest.json,Heroku,Icons,Create React App,Progressive Web Apps,Manifest.json,我有一个用CRA构建的PWA，它在Heroku上托管。PWA可以在我的iOS设备上下载，除图标外，一切正常我不确定文件引用是否正确，因为它在Heroku构建期间会发生更改。我尝试了localhost文件引用和post-build引用，但都没有提供使用图标的选项我是PWAs的新手，所以也许我犯了一个愚蠢的错误以下是manifest.json（此处的文件引用是基于Chrome开发工具中的“Sources”选项卡的后期生成）：任何想法都值得赞赏。我找到了自己的答案，我会在这里发布，以防其他人遇

我有一个用CRA构建的PWA，它在Heroku上托管。PWA可以在我的iOS设备上下载，除图标外，一切正常

我不确定文件引用是否正确，因为它在Heroku构建期间会发生更改。我尝试了localhost文件引用和post-build引用，但都没有提供使用图标的选项

我是PWAs的新手，所以也许我犯了一个愚蠢的错误

以下是manifest.json（此处的文件引用是基于Chrome开发工具中的“Sources”选项卡的后期生成）：

任何想法都值得赞赏。

我找到了自己的答案，我会在这里发布，以防其他人遇到这个问题

我在manifest.json文件中所做的工作对于Android PWA图标来说已经足够了，但在撰写本文时，iOS需要一个不同的过程

修复程序位于根文件夹中，在index.html中添加：

<link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/profilePicture/sonar_backup.png">

该链接告诉iOS专门阅读此href，并将其指定为应用程序图标

这里提供了更多有用的信息：

<link rel="apple-touch-icon" sizes="180x180" href="%PUBLIC_URL%/profilePicture/sonar_backup.png">