Solvedangular google maps Clusters are breaking the universal app

Issue description

Just importing the cluster module is breaking the app.

Steps to reproduce and a minimal demo of the problem

I have a map where all its markers are under a cluster. The map is wrapped into a conditional so it renders only on client (not on the server) because there are known issues. However, it still breaks the server side rendering because it tries to access window at some point. This probably happens during module initialization, since the component itself never got instantiated.

Current behavior

Apps using cluster cannot be used in a server side app.

Expected/desired behavior

Apps should not break.

angular & angular-google-maps version

• @angular/* at 5.0.0
• @agm/core at 1.0.0-beta.2

Other information

I'm looking for a workaround ATM but, of course, would be nice if users having a Universal app do not have to do anything. We should at least wrap all code with isPlatformBrowser and just list that as a caveat for now, until we figure out how to render maps on the server, if it's even possible.

I forked js-marker-clusterer project and made the fix. It prevents initialization MarkerClusterer when window is not defined (on server side rendering). So marker clusterer works correctly in both cases now.

It's published in npm. https://www.npmjs.com/package/js-marker-clusterer-universal

js-marker-clusterer dependency should be replaced by js-marker-clusterer-universal to take effect.

@AoschkA I'm still using the workaround as mentioned in my earlier comment. You can find my example here: https://github.com/cmddavid/js-marker-clusterer.git

@AoschkA, the repo is just the compiled output, I did not any instructions, you can add it to your package.json like this:

"@agm/js-marker-clusterer": "git+https://github.com/cmddavid/js-marker-clusterer.git"

When you install it, you will have the js-marker-clusterer without window is undefined errors, and compiled to ES2015 so it's compatible with services like Firebase.

@maksimbykov can you confirm js-marker-clusterer-universal is in your node_modules folder? perhaps it did not fully install, just in case you could run npm i --save js-marker-clusterer-universal. Also something weird seems to be going on with the file paths there. The first one has a double slash // and the second one misses a backslash \ between node_modules and @agm.

Also worth mentioning I did not check if the package still works with angular 6.

My solution base on @mbrezovsky comment above - so

• install his npm package https://www.npmjs.com/package/js-marker-clusterer-universal (or make own fork...)
• make few commands in package.json

"install:clusterer-universal": "npm i js-marker-clusterer-universal && rm -rf node_modules/js-marker-clusterer && mv node_modules/js-marker-clusterer-universal node_modules/js-marker-clusterer",
"postbuild": "npm run install:clusterer-universal"

and it will be installed after all and replaced.
And SSR works! :)