PWA対応後にiOSで記事が更新されない現象が発生

gridsome-plugin-pwaの導入後、iOSにて記事更新がされない現象が発生した。

開発者ツールで確認してみると、ServiceWorkerがwaiting to activateになったまま更新がされていないようだった。

ページを閉じて再度開き直しても変化なし。

そこで下記のissueにあるようにgridsome.server.jsにskipWaiting設定を追記したところ、正しく記事更新がされるようになった。

// gridsome.server.js
const path = require("path");
const fs = require("fs");

module.exports = function(api) {
  api.afterBuild(() => {
    const outDir = api._app.config.outputDir;
    let swPath = '';
    for (const plugin of api._app.plugins._plugins) {
      if (plugin.api._entry.use === 'gridsome-plugin-pwa') {
        swPath = path.join(outDir, plugin.api._entry.options.serviceWorkerPath);
        break;
      }
    }
    let swFile = fs.readFileSync(swPath, 'UTF-8');
    swFile += '\n\nworkbox.core.skipWaiting()';
    fs.writeFileSync('./dist/service-worker.js', swFile);
  });
};