Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Angular 18 - Standalone Components - SSR - window is not defined - only imports #369

Open
keved93 opened this issue Jul 11, 2024 · 2 comments

Comments

@keved93
Copy link

keved93 commented Jul 11, 2024

I have a Component A (Standalone), in which I import Component B.
Component A does not invoke Component B in its template.
Component B imports the LeafletModule and does nothing else.
Both components only contain imports without any additional code, checks, or templates.

Despite only having the imports, I constantly receive this error: "window is not defined". I cannot catch or bypass this error since it occurs during the import itself. All previous methods to work around this issue are no longer viable. There must be a mechanism within this module itself that checks if "window" is available or not. If "window" is usable or if the module detects that it is running in a browser and not on a server, then the module should proceed with the initialization.

I do not believe that as developers we can continue to handle this error ourselves in Angular. The provider of the module must intervene and address this issue.

@keved93 keved93 changed the title Angular 18 - Standalone Components - SSR - window is not defined Angular 18 - Standalone Components - SSR - window is not defined - only imports Jul 11, 2024
@reblace
Copy link
Contributor

reblace commented Jul 11, 2024

In ngx-leaflet, the only reference to the window object is in a HostListener annotation.

Where does the stack trace show the error coming from? Is it in Leaflet.js itself, or ngx-leaflet? If it's coming out of Leaflet.js, I'll have to look into where it's coming from and if we can't prevent that code from getting imported or monkey patch it or something.

@clcarter
Copy link

clcarter commented Aug 8, 2024

In the meantime, this can be rectified by surrounding the component that imports the LeafletModule in a @defer block. This should ensure it only renders on a client. (tested using standalone components)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants