Add support for universal server side rendering
See original GitHub issueWhen rendering pages server side is doesn’t work. At least one issue is because of the use of MutationObserver
which is browser only.
Here’s the errors is causes.
ERROR ReferenceError: MutationObserver is not defined
at CloudinaryImage.ngOnInit (/node_modules/@cloudinary/angular-4.x/src/cloudinary-image.component.js:23:29)
at checkAndUpdateDirectiveInline (/node_modules/@angular/core/bundles/core.umd.js:10868:19)
at checkAndUpdateNodeInline (/node_modules/@angular/core/bundles/core.umd.js:12364:17)
at checkAndUpdateNode (/node_modules/@angular/core/bundles/core.umd.js:12303:16)
at prodCheckAndUpdateNode (/node_modules/@angular/core/bundles/core.umd.js:12997:5)
at Object.updateDirectives (/dist-server/main.bundle.js:1:155164)
at Object.updateDirectives (/node_modules/@angular/core/bundles/core.umd.js:12754:72)
at checkAndUpdateView (/node_modules/@angular/core/bundles/core.umd.js:12270:14)
at callViewAction (/node_modules/@angular/core/bundles/core.umd.js:12635:21)
at execComponentViewsAction (/node_modules/@angular/core/bundles/core.umd.js:12567:13)
at checkAndUpdateView (/node_modules/@angular/core/bundles/core.umd.js:12276:5)
at callViewAction (/node_modules/@angular/core/bundles/core.umd.js:12635:21)
at execComponentViewsAction (/node_modules/@angular/core/bundles/core.umd.js:12567:13)
at checkAndUpdateView (/node_modules/@angular/core/bundles/core.umd.js:12276:5)
at callViewAction (/node_modules/@angular/core/bundles/core.umd.js:12635:21)
at execEmbeddedViewsAction (/node_modules/@angular/core/bundles/core.umd.js:12593:17)
TypeError: Cannot read property 'disconnect' of undefined
at CloudinaryImage.ngOnDestroy (/node_modules/@cloudinary/angular-4.x/src/cloudinary-image.component.js:32:22)
at callProviderLifecycles (/node_modules/@angular/core/bundles/core.umd.js:11220:18)
at callElementProvidersLifecycles (/node_modules/@angular/core/bundles/core.umd.js:11189:13)
at callLifecycleHooksChildrenFirst (/node_modules/@angular/core/bundles/core.umd.js:11173:17)
at destroyView (/node_modules/@angular/core/bundles/core.umd.js:12509:5)
at callViewAction (/node_modules/@angular/core/bundles/core.umd.js:12655:13)
at execComponentViewsAction (/node_modules/@angular/core/bundles/core.umd.js:12567:13)
at destroyView (/node_modules/@angular/core/bundles/core.umd.js:12508:5)
at callViewAction (/node_modules/@angular/core/bundles/core.umd.js:12655:13)
at execEmbeddedViewsAction (/node_modules/@angular/core/bundles/core.umd.js:12593:17)
Issue Analytics
- State:
- Created 6 years ago
- Reactions:1
- Comments:7
Top Results From Across the Web
Server-side rendering (SSR) with Angular Universal
This guide describes Angular Universal, a technology that renders Angular applications on the server. A normal Angular application executes in the browser, ...
Read more >Angular Universal: Complete Practical Guide
This post will be a complete practical guide for getting started with Angular Universal. We are going to go start with an existing...
Read more >How to build an Angular App with Server-Side Rendering
First run npm run build:ssr and when that is completed, run npm run serve:ssr . Your application should be served on localhost:4201. Transfer...
Read more >Server-Side Rendering (SSR ) with Angular Universal
Here's a tutorial on how to implement Server-Side Rendering (SSR ) with Angular Universal. Let's learn about SSR, its benefits, and Angular ...
Read more >How To Use Angular Universal for Server Side Rendering
Introduction. Single-page Applications (SPAs) consist of a single HTML document that is served initially to a client.
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
@mlb6 @Tomdrouv1 @dottodot our latest release should resolve this issue.
You can install it with
npm install @cloudinary/angular-5.x@^1.0.1
.@eitanp461 I’m waiting for this fix. Do you have an ETA for the new version of the library? Is there a way to use your PR with npm ? I’ve tried to change the package.json dependency to use your PR, but it does not seem to work.
"@cloudinary/angular-5.x": "cloudinary/cloudinary_angular#universal-rendering",