I execute the following mand on angular cli mand line tool, to install universal package for angular6 'ng add @ng-toolkit/universal'. It installed good,after that i execute npm run build:prod and it also runs very well. Now finally I run 'npm run server'.But this throws me error without giving me launching url.

here it is throwing error in server.js file , how to fix it.

ReferenceError: window is not defined
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122614:14)
    at __webpack_require__ (D:\ANGULAR2\dist\server.js:122314:31)
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122359:19)
    at __webpack_require__ (D:\ANGULAR2\dist\server.js:122314:31)
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122343:21)
    at __webpack_require__ (D:\ANGULAR2\dist\server.js:122314:31)
    at D:\ANGULAR2\dist\server.js:122334:19
    at D:\ANGULAR2\dist\server.js:122337:11
    at webpackUniversalModuleDefinition (D:\ANGULAR2\dist\server.js:122292:21)
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122294:4)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] serverrl `node local.js`
npm ERR! Exit status 1

as a workaround i replace window with global.

var work = global.document.createElement('div'); but window,document element is being used in many places of server.js

function(module, exports)

{   

        'use strict';   

        exports.__esModule = true;

        var tagSoup = false;

        var selfClose = false;  

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

}


function isBrowser() 

{

    return (typeof window !== 'undefined' && typeof window.document !== 'undefined');

}

I expect window.document,window to be replaced by nodejs syntax for the above sample code.

I execute the following mand on angular cli mand line tool, to install universal package for angular6 'ng add @ng-toolkit/universal'. It installed good,after that i execute npm run build:prod and it also runs very well. Now finally I run 'npm run server'.But this throws me error without giving me launching url.

here it is throwing error in server.js file , how to fix it.

ReferenceError: window is not defined
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122614:14)
    at __webpack_require__ (D:\ANGULAR2\dist\server.js:122314:31)
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122359:19)
    at __webpack_require__ (D:\ANGULAR2\dist\server.js:122314:31)
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122343:21)
    at __webpack_require__ (D:\ANGULAR2\dist\server.js:122314:31)
    at D:\ANGULAR2\dist\server.js:122334:19
    at D:\ANGULAR2\dist\server.js:122337:11
    at webpackUniversalModuleDefinition (D:\ANGULAR2\dist\server.js:122292:21)
    at Object.exports.__esModule (D:\ANGULAR2\dist\server.js:122294:4)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] serverrl `node local.js`
npm ERR! Exit status 1

as a workaround i replace window with global.

var work = global.document.createElement('div'); but window,document element is being used in many places of server.js

function(module, exports)

{   

        'use strict';   

        exports.__esModule = true;

        var tagSoup = false;

        var selfClose = false;  

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

}


function isBrowser() 

{

    return (typeof window !== 'undefined' && typeof window.document !== 'undefined');

}

I expect window.document,window to be replaced by nodejs syntax for the above sample code.

• javascript
• node.js
• angular6
• angular-universal

• what are you trying to achieve here? – messerbill Commented Apr 15, 2019 at 13:26
• simply saying , browser related keywords like window,document are giving as error when i try to execute 'npm run server' in angular cli mand tool. – rajula Commented Apr 15, 2019 at 13:36

1 Answer 1

When running your app on Angular Universal, the document, window and navigator objects will always be undefined and have no equivalent.

The reason is simple, when running an Angular app on client side, an (almost) empty HTML file is served, then the JavaScript takes over, and modifies the DOM by using window, document, etc.

When running an Angular app on server side, the execution context is totally different, Node.js has no knowledge of any browser, it just generates HTML as a full plain string without interpreting it at all. That's why those keywords can't be used in this context.

So whatever you are trying to achieve with those keywords, you'll have to find a different way for server-side rendering, or just conditionally disable this code, so it only executes on client side, and doesn't throw errors on server side.