pleasant-yellow

Unexpected token “export”

I have this reproducible stack blitz and I don’t know how to get it to work: https://stackblitz.com/edit/tanstack-router-t4oym2?file=app%2Froutes%2Findex.tsx

13 Replies

pleasant-yellowOP•14mo ago

I assume that I need some sort of vite config for this but I don’t know how

boiling-coffee•14mo ago

it looks like @cloudscape-design/components is not a valid ESM module its package.json should have "type": "module" and their imports should have file extensions

pleasant-yellowOP•14mo ago

Ah is there a way that I can fix that without fixing the upstream? some vite plugin or something?

boiling-coffee•14mo ago

hard

pleasant-yellowOP•14mo ago

I just imagine that I won’t be able to convince Amazon to fix this in any reasonable amount of time Is there a reason this works elsewhere but not in tanstack start?

boiling-coffee•14mo ago

where is "elsewhere"? you could disable SSR it seems to not be compatible with SSR I fixed the imports, but I get

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.

Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.

export const Route = createFileRoute('/')({
  component: Home,
  ssr: false
});

export const Route = createFileRoute('/')({
  component: Home,
  ssr: false
});

this will prevent SSR for this route

pleasant-yellowOP•14mo ago

Got it, yeah I can use it in a vite project just fine Anyone else have any ideas? I’m trying to migrate a site I started in NextJS but this is the biggest blocker at the moment

boiling-coffee•14mo ago

how does it work with nextjs?

pleasant-yellowOP•14mo ago

Idk how it works I just install it and put a use client and it works fine

boiling-coffee•14mo ago

so it is not server rendered you can do the same with start set ssr: false as route option

pleasant-yellowOP•14mo ago

Just in the index.tsx file right? In app/routes? Because then nothing renders haha Oh wait, that does seem to work actually

boiling-coffee•14mo ago

cool

pleasant-yellowOP•14mo ago

Huh, I feel like I tried that earlier, but I'm not sure. I appreciate the help!

Gaming

Programming

Unexpected token “export”

Did you find this page helpful?