vite-pwa / docs

Documentation: PWA integrations for Vite and the ecosystem
https://vite-pwa-org.netlify.app/
MIT License
196 stars 42 forks source link

offline mode: when I navigate to another route, it shows nothing, but when I refresh then it shows the page from cache #159

Closed tamanna-makkar closed 1 month ago

tamanna-makkar commented 1 month ago

Help needed! Am facing some issues, when I switched to offline via network tab (1) when I navigate to another route, initially it shows the blank page, it works only on refresh (2) Images are not showing, they are not from assets but hosted on another domain, like for ex - https://images.delta.com/name_of_image.jpg

and my configurations looks like this

pwa: {
    strategies: 'generateSW',
    injectRegister: 'auto',
    registerType: 'autoUpdate',
    manifest: {
      name: "Testing app",
      short_name: "Testing app",
      start_url: "/?pwa",
      scope: "/",
      icons: [
          {
              src: "maskable_icon.png",
              sizes: "384x384",
              type: "image/png",
              purpose: "maskable"
          },
          {
              src: "android-chrome-192x192.png",
              sizes: "192x192",
              type: "image/png",
              purpose: "any"
          },
          {
              src: "android-chrome-256x256.png",
              sizes: "256x256",
              type: "image/png"
          },
          {
              src: "icon.png",
              sizes: "512x512",
              type: "image/png"
          }
      ],
      theme_color: "#245BA7",
      background_color: "#000000",
      display: "standalone"
    },
    workbox: {
      navigateFallback: '/',
      globPatterns: ['**/*.{js,css,html,png,PNG,svg,jpg,JPG,jpeg}']
    },
    devOptions: {
      enabled: true,
      type: "module",
      navigateFallback: '/',
    }
  }

also I pre-rendered the nitro routes

// pre-render the routes

 async 'nitro:config'(nitroConfig) {
      if (nitroConfig.dev) { return }
      const getMenuItem = useMenuNavigation()
      const response = await fetch(`${process.env.INTERNAL_API_URL}/api/globalMenuItems`)
      const { main_menu } = await response.json()
      if (nitroConfig.prerender && nitroConfig.prerender.routes) {
        nitroConfig.prerender.routes?.push(...main_menu.map((item) => getMenuItem(item).link))
      }
      console.log(nitroConfig.prerender, 'nitroConfig.prerender')
    }

Sorry, if something I missed or wrong, Can anybody please help ?

tamanna-makkar commented 1 month ago

Sorry wrong repo, it was related to vite-pwa-nuxt3