Hi
I’m experiencing a persistent build error in my Next.js project hosted on Firebase Studio, which seems to be related to the build cache or the Turbopack parser.
Summary of the Problem: The build fails with a Parsing ecmascript source code failed: Unexpected token 'X'. Expected jsx identifier error whenever I try to render a new, moderately complex component. This happens even when the component’s code is syntactically correct and all dependencies are imported. The error persists even after running the /clean command multiple times.
Environment:
- Platform: Google Firebase Studio
- Framework: Next.js (App Router)
- UI: shadcn/ui
- Build Tool: Turbopack (default in this environment)
Steps to Reproduce:
- I have a working page component, for example,
src/app/belbin-for-virksomheder/teamudvikling/page.tsx. - I create a new, self-contained component (e.g.,
blockquote.tsx) and import it into my page. - The build fails with the parsing error. The error message points to the first line of JSX after the
<Head>component in my page file.
What I’ve Tried Without Success:
- Running the
/cleancommand in the Gemini chat multiple times. - Hard-reloading the browser preview (
Ctrl+Shift+R). - Verifying all imports are correct.
- Simplifying the component by removing dependencies like
framer-motionand large data objects. The error still occurs. - Moving the new component’s code directly inside the page file (the “all-in-one” approach). The exact same error occurs, which strongly suggests it’s not an import/export issue.
My Hypothesis: This leads me to believe there is a persistent, un-clearable cache or a resource limit issue within the Firebase Studio build environment. The Turbopack parser seems to crash when processing the page with the new component’s complexity, resulting in a misleading syntax error.
My Question: Is there a more powerful way to completely invalidate and rebuild the entire project environment beyond the /clean command? It seems the build state is “stuck” and needs a hard reset.
Thank you for your help.