Replies: 3 comments 2 replies
-
|
I had also this problem. I moved all to ssr: true .. but I think I made a mistake. |
Beta Was this translation helpful? Give feedback.
-
|
I encountered a similar issue while using a Lit component wrapped with createComponent from @lit/react. Here’s an example setup: 'use client'
import React from 'react';
import { createComponent } from '@lit/react';
import { MyElement } from './my-element.js';
const MyElementComponent = createComponent({
tagName: 'my-element',
elementClass: MyElement,
react: React,
events: {
onactivate: 'activate',
onchange: 'change',
},
});
export default MyElementComponent;I dynamically import this component in a Server Component like this: const MyElementComponent = import(() => './MyElementComponent', { ssr: false });
async function ServerComponent() {
...
return (
<div>
<MyElementComponent />
...
</div>
);
}Since This worked perfectly in Next.js 14. However, after updating to Next.js 15, using To workaround this issue, I had to create a thin wrapper client component solely for marking 'use client';
const MyElementComponent = import(() => './MyElementComponent', { ssr: false });
// Thin wrapper client component just for ssr: false
export function MyElementComponentWrapper(props) {
return <MyElementComponent {...props} />;
}Then, I use the wrapper in my Server Component: import { MyElementComponentWrapper } from './MyElementComponentWrapper';
async function ServerComponent() {
...
return (
<div>
<MyElementComponentWrapper />
...
</div>
);
}I find this approach cumbersome, as it adds unnecessary boilerplate to handle something that worked seamlessly in previous versions. Thank you for your time and consideration. I’d greatly appreciate it if this could be addressed. |
Beta Was this translation helpful? Give feedback.
-
|
Yeah, I was thinking of doing something similar, having a useless extra component only to call that This looks like a problem they have to fix, not something we need to create a workaround because they changed the behavior. |
Beta Was this translation helpful? Give feedback.
-
|
Thanks @jjmean2 , been battling this issue for like 4hrs straight, and all I had to do was wrap the dynamic import in a client component. Seriously I am weird, but Nextjs is becoming weider than me |
Beta Was this translation helpful? Give feedback.
-
|
same issue here. Has anyone found a solution? |
Beta Was this translation helpful? Give feedback.
-
Summary
I'm upgrading my Next.js 14 app to V15 but have problems with the
ssr: falseoption.in my
layout.tsxfile I have this:and the component is like so:
this works perfectly in V14 but when I upgrade to V15 it doesn't compile, now I reverted to V14 but it's something about not being able to use
ssr: falsein server components, I know I can remove that option but by reading the doc it should be possible to use it still.One of the reasons I want to use
ssr: falsebeside performance is that I have warnings aboutwindowbeingundefined.This is not just for the cookie banner but for the Google map as well, which by using this option allows me to have a better lighthouse score.
Additional information
No response
Example
No response
Beta Was this translation helpful? Give feedback.
All reactions