尽管index.html和manifest.json发生变化，iOS 15.1 safari PWA状态栏颜色仍保持绿色
尽管index.html和manifest.json发生变化，iOS 15.1 safari PWA状态栏颜色仍保持绿色
提问于 2021-10-26 08:56:27
使用ionic和capacitor构建PWA。我刚刚将我的iPhone更新为iOS 15.1。在为生产而构建时，我注意到状态栏是绿色的。我将我的apple-mobile-web-app-status-bar-style更改为black-transculent。再次构建应用程序，添加到主屏幕，但状态栏仍然是绿色的。
我检查了我的manifest.json文件，注意到theme_color属性被设置为#4DBA87。我查了一下这个颜色，发现它和我的状态栏上的绿色完全一样。将此颜色更改为#FFFFFF再次构建应用程序，添加到主屏幕，但我的状态栏仍然保持绿色。
我现在有点不知所措了。我已确保在每次构建后清除缓存，以确保新构建被加载到safari中。当我还使用iOS 14.7.x的时候，状态栏是白色的。我已经在iOS 15.1上查阅了发布说明，但它并没有提到关于safari的html属性的任何变化。
对此有什么想法吗？
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-10-26 14:06:16
事实证明，我在vue.config.js中的pwa配置设置导致我的index.html中出现了2倍的<meta name="theme-color" />标签。后者是绿色的，这是因为这个标签在我的index.html中是硬编码的，而vue pwa插件也生成了这个标签，它是最后一个绿色的标签(按顺序)。
我删除了硬编码标记，将vue.config.js中的themeColor属性设置为#FFFFFF，现在一切都很好了。
vue.config.js
pwa: {
appleMobileWebAppCapable: 'yes',
appleMobileWebAppStatusBarStyle: 'black-transculent',
themeColor: '#FFFFFF'
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/69720187
复制相关文章
相似问题
腾讯云开发者
