V5 SSR Compatability

[somespecialone]

Hi! Thank for your work! I see, that some people frustrated with window is not defined problem. I also counter this. I making Vue wrapper library for your great project. Next lines makes headache:

const defaultLenisOptions: ILenisOptions = {
    wrapper: window,
    content: document.documentElement,
    // ...
}

https://github.com/locomotivemtl/locomotive-scroll/blob/v5-beta/src/index.ts#L18-L19

Actually, I didn't get for what there is default lenis options if lenis constructor method has same defaults? Moreover, all values from defaultLenisOptions will be overrriden there:

Object.assign(this, {
     lenisOptions,
     // ....
})

https://github.com/locomotivemtl/locomotive-scroll/blob/v5-beta/src/index.ts#L78C1-L79C26

Unfortunately I can't dynamic import file. So, I just propose and ask to remove wrapper and content fields from defaultLenisOptions object, as it will solve my and others problem. Can I open a PR?

[schardev]

Yeah. I encountered this "bug" while trying out locomotive v5. I wonder why defining defaultLenisOptions outside the constructor is even needed (assuming no function/method is using it outside of the LocomotiveScroll class).

Defining it inside the constructor will resolve this issue for us react/next developers too.

If we can't move it inside of the constructor function then another workaround is to use a getter function for getting the default options, like:

function getDefaultLenisOptions(): ILenisOptions = {
   return {
      wrapper: window,
      content: document.documentElement,
      // ...
   }
}

Currently I have to disable SSR for my <SmoothScroll /> component for it to work as expected, which is fine but isn't ideal I suppose.

[Damian96]

There is also an SSR compile error (document is not defined) when trying to prerender with Angular Universal. The problem is when defining the default options var defaults = { el: document, ... as @schardev mentioned above.

Would mean a great deal to me and other angular developers to fix it somehow, because this library is essential for webpages in 2023.

[tariknh]

This worked for me with Nextjs. I had the window not defined issue. https://github.com/locomotivemtl/locomotive-scroll/issues/506#issuecomment-1753957274