如何让PWA新窗口直接以minimal-ui模式打开价目表页面？

首先，你当前的问题根源是：直接用window.open打开的新窗口默认会被浏览器当作普通网页窗口，不会自动继承PWA的minimal-ui显示模式，而且你代码里的NEW_WINDOW.open是多余的无效代码，先删掉它。

试试下面几个解决方案：

• 检查并配置Manifest的scope字段
  确保你的价目表页面在PWA的scope范围内。打开你的manifest.json，确认scope字段覆盖了价目表页面的路径。比如主应用在根目录的话，把scope设为"/"，这样所有子页面都属于PWA的范围：

  {
    "scope": "/",
    "display": "minimal-ui",
    // 其他manifest配置
  }
  

• 修改window.open的调用方式
  改用绝对路径（相对于域名根目录）打开页面，同时添加noopener和noreferrer参数，避免浏览器以普通标签页打开：

  const NEW_WINDOW = window.open('/pages/pricelist/pricelist.html', '_blank', 'noopener,noreferrer');
  

• 在价目表页面添加强制显示模式的Meta标签
  打开pricelist.html，在<head>里添加以下meta标签，强制页面以minimal-ui模式渲染：

  <meta name="display" content="minimal-ui">
  

做完这些后，重新安装PWA（先卸载旧的再重新添加到桌面），测试点击按钮打开价目表页面，应该就能直接以minimal-ui模式显示了。

内容的提问来源于stack exchange，提问作者Let's App