Closed mg-aceik closed 2 months ago
As another data point, the exact same thing happens for me in 21.7.1 as well. Not sure if this is because of a scheme mismatch between the head app and Sitecore or something else.
Got a note that downgrading to NextJS 13 instead of 14 resolved the issue, so potentially some conflict with a change in NextJS?
@mg-aceik, @georgechang - can you, please, provide more information in order to reproduce this issue? For me it's not reproducible:
Hi @illiakovalenko Sitecore support ticket was able to repro with public ref 615521.
Hi @mg-aceik , @georgechang , @Davy803 This seems to be a nextjs bug. Here is a link to the same problem in their public repo: https://github.com/vercel/next.js/issues/63820. I also verified it with a clean nextjs app. We'll contact vercel to try and escalate this. Since the problem apparently is connected with assetPrefix, as a workaround, during development, you might try to set assetPrefix to empty string in next.config.js https://github.com/Sitecore/jss/blob/5f22d4570819ce04e88de284d52a0d5076c73910/packages/create-sitecore-jss/src/templates/nextjs/next.config.js#L11 . The downside of this is that editing host might not load static assets properly (if it is also running in connected/development mode). Here is more info: https://nextjs.org/docs/app/api-reference/next-config-js/assetPrefix, https://doc.sitecore.com/xmc/en/developers/jss/latest/jss-xmc/next-js-for-xm-cloud-environment-variables.html (see info for PUBLIC_URL). In the described scenario above, the workaround should work fine.
Hi @mg-aceik , @georgechang , @Davy803 This seems to be a nextjs bug. Here is a link to the same problem in their public repo: vercel/next.js#63820. I also verified it with a clean nextjs app. We'll contact vercel to try and escalate this. Since the problem apparently is connected with assetPrefix, as a workaround, during development, you might try to set assetPrefix to empty string in next.config.js
. The downside of this is that editing host might not load static assets properly (if it is also running in connected/development mode). Here is more info: https://nextjs.org/docs/app/api-reference/next-config-js/assetPrefix, https://doc.sitecore.com/xmc/en/developers/jss/latest/jss-xmc/next-js-for-xm-cloud-environment-variables.html (see info for PUBLIC_URL). In the described scenario above, the workaround should work fine.
Had the same issue in March and was blaming jss sdk for some reason, but yes, it occured to be next.js issue :) Setting assetPrefix only for prod build, and no prefix for dev has solved the problem for me at that moment.
Hi @mg-aceik , @georgechang , @Davy803, @thezaff , quick update on this, - vercel are working on the problem : https://github.com/vercel/next.js/pull/67983
@mg-aceik I closed the ticket, since the issue is fixed on Next.js side and released as a part of 14.2.7
Describe the Bug
Hot Module Reloading described here https://nextjs.org/docs/app/api-reference/next-cli#development is not working
Console logs repeatedly:
WebSocket connection to 'ws://localhost:3000/_next/webpack-hmr' failed:
Also the whole window refreshes itself every minute or so.
To Reproduce
npx create-sitecore-jss nextjs,nextjs-sxa,nextjs-multisite,nextjs-xmcloud
npm run start:connected
Expected Behavior
No console logs about
websocket.ts:77 WebSocket connection to 'ws://localhost:3000/_next/webpack-hmr' failed:
and hmr is working when you edit a component and save.Possible Fix
No response
Provide environment information