Closed jorgebenaventee closed 1 year ago
Link to Minimal Reproducible Example is not working because Node version is not supported. You can download the project to test locally.
I created a reproducible repository and deployed it to cloudflare pages :) https://astro-react-prod-issue.pages.dev https://github.com/xesrevinu/astro-react-prod-issue
astro-react-prod-issue.pages.dev/:1 Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
(index):3 Uncaught (in promise) TypeError: Failed to fetch dynamically imported module: https://astro-react-prod-issue.pages.dev/
I created a reproducible repository and deployed it to cloudflare pages :) https://astro-react-prod-issue.pages.dev https://github.com/xesrevinu/astro-react-prod-issue
astro-react-prod-issue.pages.dev/:1 Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec. (index):3 Uncaught (in promise) TypeError: Failed to fetch dynamically imported module: https://astro-react-prod-issue.pages.dev/
Thank you very much!
Thank you for the report! We'll look into this as soon as we can!
I was able to reproduce this with Vercel serveless adapter as well. You can see that in the last commit I'm changing output
from server
to hybrid
and it stops hydrating it on the client.
I created a reproduction here https://github.com/JLarky/astro-examples/tree/main/astro-3-react-ssr-vercel-bug
instead got this:
I get somewhat similar error: I'm using React components with shadcn's navigation (Mobile and Desktop modals) with: client:load and Mobile Nav also has: client:media="(max-width: 1024px)" In preview I get 2 console errors (in dev mode it works): "SES_UNHANDLED_REJECTION: TypeError: error loading dynamically imported module: URL" And then "Loading module from “URL” was blocked because of a disallowed MIME type (“text/html”)."
same error
I was able to reproduce this with Vercel serveless adapter as well. You can see that in the last commit I'm changing
output
fromserver
tohybrid
and it stops hydrating it on the client.I created a reproduction here JLarky/astro-examples@
main
/astro-3-react-ssr-vercel-buginstead got this:
did it work for you with the output: server
? Because neither works for me.
I get the same error with Svelte components.
"@astrojs/node": "^6.0.0",
(also "@astrojs/netlify": "^3.0.1",
)
"@astrojs/svelte": "^4.0.0",
"astro": "^3.0.7",
Same with Vue
Seems to have been fixed with https://github.com/withastro/astro/pull/8388
I get the same issue using hybrid
mode with Vercel:
prerender = false
);Never mind, I was still using Astro version 3.0
. I can confirm that the issue is solved for version 3.1.2
. Thank you for the fix, you rock! 🚀
Astro info
What browser are you using?
Chrome
Describe the Bug
After upgrading to Astro 3.0 while using node adapter and hybrid output, it is adding
before-hydration-url=/
attribute to React client components. This makeschildrenConnectedCallback
try to import/
and breaking the rendering causing the following error message in browser console when runningastro preview
(Works fine in dev mode)What's the expected result?
I expected my component to render properly
Link to Minimal Reproducible Example
https://stackblitz.com/edit/github-bmpb88
Participation