You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Astro v4.11.3
Node v22.2.0
System macOS (arm64)
Package Manager pnpm
Output server
Adapter @astrojs/node
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
I am unable to use the Container API clientside within an Astro project
it fails with: Uncaught SyntaxError: The requested module '/node_modules/prismjs/prism.js?v=07c8055a' does not provide an export named 'default' (at highlighter.js?v=07c8055a:1:8)
In earlier versions I had different errors mentioning something about Vite.
I had tried rendering Astro components with it from within a React component before, so assume it should be possible. What however failed there was passing the React Renderer to the Container, I think it had a similar vite-related error.
What's the expected result?
Be able to use the Container API in the Browser, within an Astro projects.
My use case is live previews of Astro Pages from a CMS. Using React I could simply use client side Interactivity. For Astro Components there was no solution so far (except server-rendering the page with preview data each time).
The Container API might solve this.
@ematipico is that an issue on a technical level or because of the resulting bundle size?
For that specific preview page which would utilize client rendering the larger bundle size wouldn’t be much of an issue.
My only concern would be to make sure certain server functions or secrets don’t leak into the client bundle somehow. But from how I understand it works, the client side Astro instance would be totally separate in the browser, and while there might be server-facing code in Astro files it has bundled, it would only be of those Components that I pass to it so it’s a matter of diligence, both regarding security and browser compatibility.
It's a technical limitation, Astro depends on many many things that don't run in the browser. It's not impossible that one day, perhaps, in a long future... but for now it'd be quite tough.
I'll close this issue in favour of the discussion around the RFC, feel free to bring up this need there: withastro/roadmap#916
Astro Info
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
I am unable to use the Container API clientside within an Astro project
it fails with:
Uncaught SyntaxError: The requested module '/node_modules/prismjs/prism.js?v=07c8055a' does not provide an export named 'default' (at highlighter.js?v=07c8055a:1:8)
In earlier versions I had different errors mentioning something about Vite.
I had tried rendering Astro components with it from within a React component before, so assume it should be possible. What however failed there was passing the React Renderer to the Container, I think it had a similar vite-related error.
What's the expected result?
Be able to use the Container API in the Browser, within an Astro projects.
My use case is live previews of Astro Pages from a CMS. Using React I could simply use client side Interactivity. For Astro Components there was no solution so far (except server-rendering the page with preview data each time).
The Container API might solve this.
Link to Minimal Reproducible Example
https://stackblitz.com/edit/github-guff1q?file=src%2Fpages%2Findex.astro
Participation
The text was updated successfully, but these errors were encountered: