Skip to content
This repository was archived by the owner on May 2, 2024. It is now read-only.

disable debug messages #79

Closed
felek000 opened this issue Jan 2, 2023 · 4 comments · Fixed by #83
Closed

disable debug messages #79

felek000 opened this issue Jan 2, 2023 · 4 comments · Fixed by #83
Labels
question Further information is requested

Comments

@felek000
Copy link

felek000 commented Jan 2, 2023

Hello,
I use standard config:

```

pwa: {
workbox: {
enabled: true
}
}

How can i enable production mode to disable console messages?
Also is there is available some hooks for workobox like: updated,register ? Or i have to build file for my own in that case ? any example ?
@kevinmarrec
Copy link
Owner

Hi @felek000

Are you talking about warnings when running workbow.enabled in development mode ? Or do you want an option to disable any console messages the module outputs ?

About Workbox hooks, for now you're required to use a custom worker template based on something similar to https://github.com/kevinmarrec/nuxt-pwa-module/blob/main/templates/workbox/sw.js

@kevinmarrec kevinmarrec added the question Further information is requested label Jan 3, 2023
@kevinmarrec
Copy link
Owner

Also is there is available some hooks for workobox like: updated,register ? Or i have to build file for my own in that case ? any example ?

Also see #58 (comment)

@felek000
Copy link
Author

felek000 commented Jan 4, 2023

I end on write custom sw.
Ony think i woul like to know is how to notify user that new content is available or its updated.
For now this is for cache resource.

importScripts('<%= options.workboxUrl %>')
self.__WB_DISABLE_DEV_LOGS = true
self.addEventListener('install', () =>  self.skipWaiting())
self.addEventListener('activate', () => {})

const { registerRoute } = workbox.routing
const { NetworkFirst, StaleWhileRevalidate, CacheFirst } = workbox.strategies
const { CacheableResponsePlugin } = workbox.cacheableResponse
const { ExpirationPlugin } = workbox.expiration

// Cache page navigations (html) with a Network First strategy
registerRoute(
  ({ request }) => {
    return request.mode === 'navigate'
  },
  new NetworkFirst({
    cacheName: 'pages',
    plugins: [
      new CacheableResponsePlugin({ statuses: [200] }),
    ],
  }),
)

// Cache Web Manifest, CSS, JS, and Web Worker requests with a Stale While Revalidate strategy
registerRoute(
  ({ request }) =>
    request.destination === 'manifest' ||
    request.destination === 'style' ||
    request.destination === 'script' ||
    request.destination === 'worker',
  new StaleWhileRevalidate({
    cacheName: 'assets',
    plugins: [
      new CacheableResponsePlugin({ statuses: [200] }),
    ],
  }),
)

// Cache images with a Cache First strategy
registerRoute(
  ({ request }) => request.destination === 'image',
  new CacheFirst({
    cacheName: 'images',
    plugins: [
      new CacheableResponsePlugin({ statuses: [200] }),
      // 50 entries max, 30 days max
      new ExpirationPlugin({ maxEntries: 50, maxAgeSeconds: 60 * 60 * 24 * 30 }),
    ],
  }),
)

@kevinmarrec
Copy link
Owner

@felek000 I think the answer should be found in Workbox documentation.

I think it is through installed event, something like this :

self.addEventListener('installed', event => {
  if (event.isUpdate) {
    console.log('New content is available !')
  }
})

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
question Further information is requested
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants