universal-starter icon indicating copy to clipboard operation
universal-starter copied to clipboard

Postscribe(use to add 3rd party script) is not working: Angular 9 Universal.

Open junaidbinsarfraz opened this issue 5 years ago • 0 comments

In Angular 7 Universal, I was able to add 3rd party scripts using postscribe (without any special settings). Now I am trying to use postscribe in Angular 9 Universal project like

if(this.isBrowser) {
    // ... my postscribe code here
}

but its giving below error

var work = window.document.createElement('div');
                           ^

ReferenceError: window is not defined
    at Object.<anonymous> (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204958:14)
    at __webpack_require__ (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204658:31)
    at Object.<anonymous> (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204703:19)
    at __webpack_require__ (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204658:31)
    at Object.<anonymous> (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204687:21)
    at __webpack_require__ (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204658:31)
    at E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204678:19
    at E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204681:11
    at webpackUniversalModuleDefinition (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204636:21)
    at Object.<anonymous> (E:\Projects\NationalResourceConnect\frontend\angular-universal-starter\dist-server\main.js:204638:4)

A server error has occurred.
node exited with 1 code.

In server.ts I have added

// for mock global window by domino
const win = domino.createWindow(template);
// mock
global['window'] = win;

Not sure why its giving this error, any clue? I am using "postscribe": "^2.0.8".

Complete Log

$ npm run ssr

> [email protected] ssr E:\Projects\angular-universal-starter
> ng run universal-demo:serve-ssr

****************************************************************************************
This is a simple server for use in testing or debugging Angular applications locally.
It hasn't been reviewed for security issues.

DON'T USE IT FOR PRODUCTION!
****************************************************************************************
Hash: 8e8bf0402197478a1be2
Time: 43386ms
Built at: 07/01/2020 8:30:09 PM
      Asset      Size  Chunks                          Chunk Names
    main.js  10.7 MiB    main  [emitted]        [big]  main
main.js.map  11.2 MiB    main  [emitted] [dev]         main
Entrypoint main [big] = main.js main.js.map
chunk {main} main.js, main.js.map (main) 10.3 MiB [entry] [rendered]

chunk {app-static-static-module} app-static-static-module.js, app-static-static-module.js.map (app-static-static-module) 59.5 kB  [rendered]
chunk {main} main.js, main.js.map (main) 928 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 608 kB [initial] [rendered]
chunk {polyfills-es5} polyfills-es5.js, polyfills-es5.js.map (polyfills-es5) 694 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 9.07 kB [entry] [rendered]
chunk {styles} styles.css, styles.css.map (styles) 205 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 6.41 MB [initial] [rendered]
Date: 2020-07-01T15:30:16.786Z - Hash: 466864382a957d66d22c - Time: 45587ms

Compiled successfully.
E:\Projects\angular-universal-starter\dist-server\main.js:204958
                var work = window.document.createElement('div');
                           ^

ReferenceError: window is not defined
    at Object.<anonymous> (E:\Projects\angular-universal-starter\dist-server\main.js:204958:14)
    at __webpack_require__ (E:\Projects\angular-universal-starter\dist-server\main.js:204658:31)
    at Object.<anonymous> (E:\Projects\angular-universal-starter\dist-server\main.js:204703:19)
    at __webpack_require__ (E:\Projects\angular-universal-starter\dist-server\main.js:204658:31)
    at Object.<anonymous> (E:\Projects\angular-universal-starter\dist-server\main.js:204687:21)
    at __webpack_require__ (E:\Projects\angular-universal-starter\dist-server\main.js:204658:31)
    at E:\Projects\angular-universal-starter\dist-server\main.js:204678:19
    at E:\Projects\angular-universal-starter\dist-server\main.js:204681:11
    at webpackUniversalModuleDefinition (E:\Projects\angular-universal-starter\dist-server\main.js:204636:21)
    at Object.<anonymous> (E:\Projects\angular-universal-starter\dist-server\main.js:204638:4)

A server error has occurred.
node exited with 1 code.
connect ECONNREFUSED 127.0.0.1:55182
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] ssr: `ng run universal-demo:serve-ssr `
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] ssr script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\test\AppData\Roaming\npm-cache\_logs\2020-07-01T15_30_47_590Z-debug.log

junaidbinsarfraz avatar Jun 29 '20 12:06 junaidbinsarfraz