问题标签 [next-pwa]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
workbox - 无法让工作箱 BackgroundSyncPlugin 与 next-pwa 一起使用,离线时网络选项卡中不显示任何请求
我计划将 next-pwa 与 workbox 的后台同步插件结合使用,以在客户端在线时重试离线 POST/PUT/DELETE 请求。
我已经设置了一个 runtimeCaching 条目:
它似乎正在缓存 GET 请求,但对 POST 请求没有任何作用。
javascript - PWA “start_url 确实响应了,但不是通过服务人员。” -- NextJS-PWA
我一直在使用next-pwa
(npm 链接)来自动化服务人员设置,以便在 NextJS 中设置 PWA。在大多数情况下,一切都很顺利。但是,我一生都无法弄清楚如何解决仍然出现在灯塔审计中的一个错误(如下所示)。我已经阅读了大量帖子并尝试实施几种不同的解决方案,但到目前为止还没有成功。
这是由sw.js
自动创建的NextJS
。
这里是next.config.js
和我的public/manifest.json
我几乎没有想法,我一直在阅读next-pwa npm 文档,相关的示例文件和第三方资源,对于所有这些似乎都有效,但是......我'我没有这样的运气。
最后,我部署它时的响应(虽然它成功了,也许这是问题的一部分?)
reactjs - fsevents@2.3.2 安装问题的不支持平台
我一直在尝试将我的应用程序部署到 vercel 一段时间,并且一直在阅读有关 stackoverflow 的许多帖子,其中存在相同/相似的fsevents
问题。尽管我不断收到下面发布的相同错误。
我尝试过的事情:
- 卸载
node_modules
&package-lock.json
,然后运行:npm i -f
- 加
"optionalDependencies": {"fsevents": "^2.3.2"}
,然后npm i -f
fsevents
不安装package.json
- ...以及许多其他尝试
我的部署中总是发生的事情的屏幕截图
我不太熟悉整个 fsevents/chokidar 包的内容/原因,但在我阅读完之后,我的 MacOS 似乎需要它,我真的很感激解决这个问题的一些想法。
当前 package.json
javascript - Uncaught (in promise) TypeError: Failed to fetch Nextjs PWA using next-pwa in Chrome
嗨,我正在研究 Nextjs 项目,我尝试使用 next-pwa 将其转换为 PWA,首先我创建了 next.config.js
然后创建了 manifest.json
我在页面中的 de _document 文件中添加元数据
但是当我运行时:
在 Google Chrome 中我的 PWA 工作正常,但在控制台中我收到此错误:在其他浏览器中,此错误不会出现
Uncaught (in promise) TypeError: Failed to fetch
而且我真的不知道为什么,使用 npm run dev 在 dev mod 中运行应用程序我在 chrome 中收到以下消息:
这是我的公用文件夹结构:
我试图在这个视频中做同样的事情。 https://www.youtube.com/watch?v=8enp-acPbRE
任何人都可以帮助我吗
next.js - Unable to build project that includes a custom worker file
I'm facing a very strange issue with next-pwa
. Whenever I try to build a next-pwa
project that includes a custom worker js file, the build fails with the following error:
I have tried several things so far to fix this issue:
- Clone the repo and updated all dependencies (i thought the issue might be webpack related)
- Building the project without a custom worker file (works fine)
- Downgrade to Node 10, 12, 14, 15, and re-install dependencies.
I've also tried the to use the code provided in the /example folder of the repo, but the same issue occurs there as well.
I'm not the only one facing this issue so i would appreciate help.
You can test it yourself using Gitpod, just open this link and navigate to the example, install dependencies and try yarn build
.
reactjs - (next 10) - 将 basePath 添加到 next.config.js 时,next-pwa 不起作用
我正在使用 nextJS 版本“10.0.9”和 next-pwa 版本“^5.0.6”,它们一起工作得很好,我的应用程序无法满足,但由于某些原因,我需要为所有路由添加前缀,所以我添加“basePath”属性并在 next.config.js 文件中将其设置为“/recharge-cards”,但之后我的应用程序变得可卸载,我尝试了很多方法,将范围和 subdomainPrefix 更改为“/recharge-cards”并更改我的 _document.js 上的文件路径,但似乎没有任何效果。
下面你会找到我的文件,所以帮我解决这个问题
清单.json
next.config.js
_document.js(头部)
项目文件
next.js - 在 vercel 中部署 next-pwa(Next.js) 应用程序时出现“未捕获(承诺)不良预缓存响应”
当我Uncaught (in promise) bad-precaching-response: bad-precaching-response :: [{"url":"https://myapp.vercel.app/_error","status":404}]
在 vercel 中部署我的应用程序时,我的 next-pwa 应用程序和服务工作者无法正常工作,尽管它在 localhost 中运行良好,没有错误。我在这里遵循了基本用法https://www.npmjs.com/package/next-pwa,但我使用 firebase-messaging-sw.js 来使用 cloud-messaging 以及 sw.js(service worker) 来进行 pwa。目前我也没有上面错误中提到的_error.js。我认为这些事情可能会影响错误,但到目前为止我还没有任何线索。实际上,我曾经将 _error.js 添加到我的项目中,但它没有做出任何改变......有人可以帮忙解决这个问题吗?先感谢您!
根目录下的 next.config.js
公共目录中的 manifest.json(图标在公共目录下的图标目录中)
_document.js
包.json
reactjs - 如何使用 next-pwa 添加推送通知
我有一个 Next.js 应用程序,next-pwa
用于离线模式。现在我想添加推送通知(OneSignal 解决方案),我看过很多文章/教程,它们都需要创建/更新服务工作者。
所以我的问题是:我怎么能做到这一点,因为服务工作者是由生成的,next-pwa
而且它似乎不可编辑,因为它被缩小了。
javascript - NextJS 动态 SSR:错误卡在移动设备中加载
问题:
Next JS 动态导入在移动设备浏览器上加载时卡住了(使用的浏览器:IOS 上的 Google Chrome 和 Safari。)而它在桌面上的 Google Chrome 和 Mozilla 上运行良好。我也在默认配置上使用 next-PWA。会不会是因为 next-PWA?
代码片段:
在移动设备上输出
桌面浏览器上的输出
next.js - 使用 next-pwa 安装 PWA 弹出窗口
我看过很多关于让弹出横幅在 PWA 上工作的教程。我正在使用next-pwa
,我的问题是我对在哪里添加弹出横幅的代码感到困惑。抱歉,如果这看起来微不足道,但我对此并不陌生。我还认为 next-pwa 默认会这样做(这里可能非常错误)?
我的项目结构如下:
我的清单文件在下面,我还通过了 Lighthouse 审核中的所有检查,并且可安装对我来说是绿色的