pwa-module icon indicating copy to clipboard operation
pwa-module copied to clipboard

Workbox new version available even after reloading

Open Musashi-Sakamoto opened this issue 4 years ago • 1 comments

Hi I put this code in created funciton in layouts/default.vue to implement Refresh to Update Notification

Even after reloading the page, event.isUpdate returns true

const workbox = await window.$workbox;
  if (workbox) {
    workbox.addEventListener('installed', (event) => {
        if (event.isUpdate) {
          console.log('New site available. User can reload the page')
        }
    });
  }

I expected event.isUpdate to return false after reloading unless new versions of the site is available. Is this an expected behavior or is there something wrong with my config?

Here is my nuxt.config.js .

require('dotenv').config()

export default {
  // Disable server-side rendering: https://go.nuxtjs.dev/ssr-mode
  ssr: false,

  // Target: https://go.nuxtjs.dev/config-target
  target: 'static',

  server: {
    port: 5555,
    host: '0.0.0.0'
  },

  // Global page headers: https://go.nuxtjs.dev/config-head
  head: {
    title: '売り子ール',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  // Global CSS: https://go.nuxtjs.dev/config-css
  css: [
    '@/assets/main.css',
  ],

  // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins
  plugins: [
    '~/plugins/confirm.js',
    '~plugins/day.js',
    '~/plugins/panZoom.js',
  ],

  // Auto import components: https://go.nuxtjs.dev/config-components
  components: true,

  // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules
  buildModules: [
    '@nuxtjs/dotenv',
  ],

  // Modules: https://go.nuxtjs.dev/config-modules
  modules: [
    // https://go.nuxtjs.dev/pwa
    '@nuxtjs/firebase',
    '@nuxtjs/onesignal',
    '@nuxtjs/pwa',
    'nuxt-webfontloader',
    '@nuxtjs/axios',
    '@nuxtjs/sentry',
    '@nuxtjs/i18n',
  ],
  i18n: {
    strategy: 'no_prefix',
    // 切り替える言語を定義
    locales: [
      { code: 'ja', iso: 'ja', file: 'ja.json' },
      { code: 'en', iso: 'en', file: 'en.json' },
    ],
    // デフォルトの言語を↑で定義したcodeで記載
    defaultLocale: 'ja',
    vueI18nLoader: true,
    lazy: true,
    // 言語ファイル(.json)のディレクトリを記載
    langDir: '~/locales/',
  },
  sentry: {
    dsn: process.env.SENTRY_DSN, // Enter your project's DSN here
    // Additional Module Options go here
    // https://sentry.nuxtjs.org/sentry/options
  },
  axios: {
    baseURL: process.env.FIREBASE_API_HOST
  },
  webfontloader: {
    google: {
      families: ['Noto+Sans+JP:300,400,500,700']
    }
  },

  firebase: {
    config: {
      apiKey: `${process.env.FIREBASE_API_KEY}`,
      authDomain: `${process.env.FIREBASE_PROJECT_ID}.firebaseapp.com`,
      databaseURL: `https://${process.env.FIREBASE_PROJECT_ID}.firebaseio.com`,
      projectId: process.env.FIREBASE_PROJECT_ID,
      storageBucket: `${process.env.FIREBASE_PROJECT_ID}.appspot.com`,
      messagingSenderId: process.env.FIREBASE_MESSAGING_SENDER_ID,
      appId: process.env.FIREBASE_APP_ID,
    },
    services: {
      auth: true,
      firestore: true,
      storage: true,
    },
  },

  // PWA module configuration: https://go.nuxtjs.dev/pwa
  pwa: {
    manifest: {
      name: process.env.APP_NAME,
      short_name: process.env.APP_NAME,
      lang: 'ja',
      display: 'fullscreen',
      orientation: 'landscape',
    },
    workbox: {
      swURL: 'OneSignalSDKWorker.js',
    }
  },
  // Options
  oneSignal: {
    init: {
      appId: process.env.ONE_SIGNAL_APP_ID,
      allowLocalhostAsSecureOrigin: true,
      welcomeNotification: {
        disable: true
      },
      autoResubscribe: true
    }
  },

  // Build Configuration: https://go.nuxtjs.dev/config-build
  build: {
    extend(config, ctx) {},
    postcss: {
      preset: {
        features: {
          'nesting-rules': true
        }
      }
    }
  },
  
}

Musashi-Sakamoto avatar Sep 02 '21 03:09 Musashi-Sakamoto

I found out that this issue only happens when you are using onesignal module too

Musashi-Sakamoto avatar Sep 02 '21 03:09 Musashi-Sakamoto