next.js - 使用 next-pwa 安装 PWA 弹出窗口

Question

我看过很多关于让弹出横幅在 PWA 上工作的教程。我正在使用next-pwa，我的问题是我对在哪里添加弹出横幅的代码感到困惑。抱歉，如果这看起来微不足道，但我对此并不陌生。我还认为 next-pwa 默认会这样做（这里可能非常错误）？

我的项目结构如下：

pages
--_app.js
-- index.js

public
-- icon/icons
-- favicons.ico
-- manifest.json
-- sw.js
-- sw.js.map

我的清单文件在下面，我还通过了 Lighthouse 审核中的所有检查，并且可安装对我来说是绿色的

{
    "name": "PWA App",
    "short_name": "App",
    "icons": [
      {
        "src": "/icons/lion.png",
        "sizes": "192x192",
        "type": "image/png",
        "purpose": "any maskable"
      },
      {
        "src": "/icons/tiger.png",
        "sizes": "384x384",
        "type": "image/png"
      },
      {
        "src": "/icons/bear.png",
        "sizes": "512x512",
        "type": "image/png"
      }
    ],
    "theme_color": "#FFFFFF",
    "background_color": "#FFFFFF",
    "start_url": "/",
    "display": "standalone",
    "orientation": "portrait",
    "prefer_related_applications": false
}