-
Notifications
You must be signed in to change notification settings - Fork 3
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
new URL(..., import.meta.url)
behavior difference between Vite SSR and Next edge
#510
Comments
hi-ogawa
changed the title
Jul 7, 2024
new URL(..., import.meta.url)
behavior difference between Vite and Next (webpack?) on SSRnew URL(..., import.meta.url)
behavior difference between Vite and Next on SSR
Indeed, it seems like this is a fairly narrowly targeted feature just for edge: |
Output in //
// (rsc)/./app/api/og/route.tsx
//
const interSemiBold = fetch(
/* asset import */ new __webpack_require__.U(
__webpack_require__(
/*! ./Inter-SemiBold.ttf */ "(edge-asset)/./app/api/og/Inter-SemiBold.ttf",
),
),
).then((res) => res.arrayBuffer());
//
// (edge-asset)/./app/api/og/Inter-SemiBold.ttf
//
module.exports = "blob:Inter-SemiBold.ebaf29e951de4564.ttf" |
hi-ogawa
changed the title
Jul 10, 2024
new URL(..., import.meta.url)
behavior difference between Vite and Next on SSRnew URL(..., import.meta.url)
behavior difference between Vite and Next edge
hi-ogawa
changed the title
Jul 10, 2024
new URL(..., import.meta.url)
behavior difference between Vite and Next edgenew URL(..., import.meta.url)
behavior difference between Vite SSR and Next edge
4 tasks
10 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Next app router demo has this code in server component and it looks this is processed to be:
.next/server/edge-chunks/asset_Inter-SemiBold.ebaf29e951de4564.ttf
blob:Inter-SemiBold.ebaf29e951de4564.ttf
loaded runtime magicallyhttps://github.com/vercel/next-app-router-playground/blob/e9d64dd5018d5280fee725fd4d44ea90d66c75f7/app/api/og/route.tsx#L7-L9
I don't think Vite SSR does such things and this
new URL
simply ends up withfile:(filepath)/Inter-SemiBold.ttf'
, sofetch
fails.Probably such usage is an edge case (or maybe not https://nextjs.org/docs/app/api-reference/file-conventions/metadata/opengraph-image#generate-images-using-code-js-ts-tsx), but it's worth checking out where this feature is coming form either directly from webpack or next.js (I don't think this is what webpack does by default https://webpack.js.org/api/module-variables/#importmetaurl)
For example, some questions:
.ttf
etc..?export const runtime = "edge"
?route.js
?Also side note, I just found the official migration guide from Vite React SPA to Next.js https://nextjs.org/docs/app/building-your-application/upgrading/from-vite It mentions some difference of static assets handling.
The text was updated successfully, but these errors were encountered: