ngx-chips: SSR - Window is not defined

PLEASE MAKE SURE THAT:

  • you searched similar issues online (9/10 issues in this repo are solved by googling, so please…do it)
  • you provide an online demo I can see without having to replicate your environment
  • you help me by debugging your issue, and if you can’t, do go on filling out this form

I’m submitting a … (check one with “x”)

[ x] bug report => search github for a similar issue or PR before submitting
[ ] support request/question

Notice: feature requests will be ignored, submit a PR if you'd like

Current behavior

Prevents application from running because window is not defined

Expected behavior

The app would run and I would be able to use ngx-chips with out the error “Window is not defined”

Minimal reproduction of the problem with instructions (if applicable)

see: #492

This issue persists and a hack that is provided in the above is not relevant to my situation as I do not use the same repo and upon attempting to use it was faced with even more errors, unfortunately the issue was closed with no fix.

Previously I would just roll back to an older version, however that no longer seems to work due to the dependency to ng2-material-dropdown, which causes the error:

NodeInvocationException: Prerendering failed because of error: TypeError: Object(…) is not a function at eval (webpack-internal:///./node_modules/ng2-material-dropdown/ng2-material-dropdown.es5.js:458:155) at Module…/node_modules/ng2-material-dropdown/ng2-material-dropdown.es5.js (G:\05072018\aspnetcore-angular2-universal-master\ClientApp\dist\main-server.js:9274:1) at webpack_require (G:\05072018\aspnetcore-angular2-universal-master\ClientApp\dist\main-server.js:20:30) at eval (webpack-internal:///./node_modules/ngx-chips/esm5/ngx-chips.js:16:79) at Module…/node_modules/ngx-chips/esm5/ngx-chips.js (G:\05072018\aspnetcore-angular2-universal-master\ClientApp\dist\main-server.js:12214:1) at webpack_require (G:\05072018\aspnetcore-angular2-universal-master\ClientApp\dist\main-server.js:20:30) at eval (webpack-internal:///./ClientApp/app/dashboard/dashboard.module.ts:30:68) at Module…/ClientApp/app/dashboard/dashboard.module.ts (G:\05072018\aspnetcore-angular2-universal-master\ClientApp\dist\main-server.js:1125:1) at webpack_require (G:\05072018\aspnetcore-angular2-universal-master\ClientApp\dist\main-server.js:20:30) at eval (webpack-internal:///./ClientApp/app/app.module.ts:47:86) Current directory is: G:\05072018\aspnetcore-angular2-universal-master

To reproduce the error use this repo: https://github.com/MarkPieszak/aspnetcore-angular2-universal

Add ngx-chips to the app.module.ts and use in one of the components.

What do you use to build your app?. Please specify the version

“webpack”: “^4.9.1”

Angular version:

6.0.3

ngx-chips version:

1.9.2

Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

About this issue

  • Original URL
  • State: open
  • Created 6 years ago
  • Reactions: 6
  • Comments: 16 (4 by maintainers)

Most upvoted comments

Same issue here.

ReferenceError: window is not defined node_modules/ngx-chips/bundles/ngx-chips.umd.js:1497:21 node_modules/ngx-chips/bundles/ngx-chips.umd.js:2:68 /node_modules/ngx-chips/bundles/ngx-chips.umd.js:5:2

There’s workaround without involving ngx-chips code

check this out: https://github.com/angular/universal/issues/830#issuecomment-345228799

You can fix window is not defined like this: server.ts (start of file)

const domino = require(‘domino’); const fs = require(‘fs’); const path = require(‘path’); const template = fs.readFileSync(path.join(__dirname, ‘.’, ‘dist’, ‘index.html’)).toString(); const win = domino.createWindow(template); global[‘window’] = win; global[‘document’] = win.document;

look: https://github.com/Angular-RU/angular-universal-starter/blob/master/server.ts