sw-precache-webpack-plugin在NextJs的最新版本中会引起错误。

使用 workbox-webpack-plugin 代替 sw-precache-webpack-plugin。下面是一个示例配置：

const withOffline = require('next-offline')
const path = require('path')
const { GenerateSW } = require('workbox-webpack-plugin')

module.exports = withOffline({
  webpack: (config, { dev }) => {
    if (!dev) {
      config.plugins.push(
        new GenerateSW({
          swDest: path.join(__dirname, 'static', 'service-worker.js'),
          clientsClaim: true,
          skipWaiting: true,
          runtimeCaching: [
            {
              urlPattern: /^https?.*/,
              handler: 'NetworkFirst',
              options: {
                cacheName: 'https-calls',
                networkTimeoutSeconds: 15,
                expiration: {
                  maxEntries: 150,
                  maxAgeSeconds: 30 * 24 * 60 * 60,
                },
                cacheableResponse: {
                  statuses: [0, 200],
                },
              },
            },
          ],
        })
      )
    }

    return config
  },
})