使用 next.js 创建 PWA 时编译错误答案

【问题标题】：Failed to compile error during creating PWA with next.js使用 next.js 创建 PWA 时编译错误
【发布时间】：2022-10-18 22:01:54
【问题描述】：

我运行命令： npm run build

错误： info - 创建优化的生产版本
编译失败。

请检查您的 GenerateSW 插件配置： [WebpackGenerateSW] 'reactStrictMode' 属性预计不会出现在这里。您是说财产“排除”吗？

由于 webpack 错误，构建失败

【问题讨论】：

标签： next.js progressive-web-apps

【解决方案1】：

如果您的next-pwa 版本是5.6 而您的next.config.js 是这样的：

const withPWA = require('next-pwa')
const runtimeCaching = require('next-pwa/cache')  

module.exports = withPWA({
  pwa: {
    dest: 'public',
    runtimeCaching,
  },
})

那你应该考虑改一下as written in the README.md file：

const withPWA = require('next-pwa')({
  dest: 'public'
})

module.exports = withPWA({
  // next.js config
})

我在关注the pwa example of nextjs 时遇到了这个问题。我的next-pwa 版本是5.6，示例的版本是5.5.4，所以它不起作用。

【讨论】：

感谢@TechWisdom 纠正我的语法错误！
欢迎@xjw_2000。感谢您的精彩回答，对我帮助很大！它解决了我的问题。继续努力，希望您在 Stackoverflow 上过得愉快 :)

【解决方案2】：

这对我有用

const runtimeCaching = require("next-pwa/cache");
const withPWA = require("next-pwa")({
    dest: "public",
    register: true,
    skipWaiting: true,
    runtimeCaching,
    buildExcludes: [/middleware-manifest.json$/],
});

const nextConfig = withPWA({
    // next config
});
module.exports = nextConfig;

【讨论】：