Find Client Side calls preventing server render
From the docs
When importing a library that relies on browser APIs and has side effects, make sure the component importing it is only called client-side. Bundlers do not treeshake imports of modules containing side effects.How can I best find these browser apis? Can I make nuxt throw an error on build - looking for a similar error experience as Next.js has with their client side vs server side components.
5 Replies
If you have a component that can only operate client-side, you can name the component
MyComponent.client.vue and it won't be rendered on the serverword - will it throw an error if it tries to do server side stuff?
is the opposite true can I have a .server.vue that will error on access to things like window?
A guide to Nuxt server components
It's possible to use server components within Nuxt, even if you are generating a static site. Here's how.
Yes, that's correct
.server is server-only, and the non-interactive result would be sent as HTML
Nuxt
components/ · Nuxt Directory Structure
The components/ directory is where you put all your Vue components.