Angular5 webpack ReferenceError：未定义窗口

Posted 2023-03-07

【中文标题】Angular5 webpack ReferenceError：未定义窗口

【英文标题】：Angular5 webpack ReferenceError: window is not defined

【发布时间】：2018-10-29 06:23:34

【问题描述】：

我在尝试使用 angular-universal 配置我的 angluar2 应用程序时遇到 windows 未定义错误。

cli 版本从 1.7.4 -> 6.0.3 迁移

以下是我遇到的错误。

E:\Personal\my_codes\dist\server.js:1721
 */,function(e,t,n)"use strict";n.r(t),n.d(t,"provideModuleMap",function()return a),n.d(t,"ModuleMapLoaderModule",function()return s),n.d(t,"MODULE_MAP",function()return i),n.d(t,"ModuleMapNgFactoryLoader",function()return o);var r=n(0),i=new r.InjectionToken("MODULE_MAP"),o=function()function e(e,t)this.compiler=e,this.moduleMap=treturn e.prototype.load=function(e)var t=this.compiler instanceof r.Compiler,n=this.moduleMap[e];if(!n)throw new Error(e+" did not exist in the MODULE_MAP");return t?this.loadFactory(n):this.loadAndCompile(n),e.prototype.loadFactory=function(e)return new Promise(function(t)return t(e)),e.prototype.loadAndCompile=function(e)return this.compiler.compileModuleAsync(e),e.decorators=[type:r.Injectable],e.ctorParameters=function()return[type:r.Compiler,type:void 0,decorators:[type:r.Inject,args:[i]]],e();function a(e)returnprovide:i,useValue:evar s=function()function e()return e.withMap=functio

ReferenceError: window is not defined
    at Object.<anonymous> (E:\Personal\my_codes\dist\server.js:1721:1147)
    at n (E:\Personal\my_codes\dist\server.js:1:172)
    at Object.<anonymous> (E:\Personal\my_codes\dist\server.js:2001:2400)
    at n (E:\Personal\my_codes\dist\server.js:1:172)
    at E:\Personal\my_codes\dist\server.js:1:579
    at Object.<anonymous> (E:\Personal\my_codes\dist\server.js:1:590)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
    at tryModuleLoad (module.js:505:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! col-ui@0.0.0 serve:s-s-r: `node dist/server.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the col-ui@0.0.0 serve:s-s-r script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

任何关于我如何解决这个问题的建议都会非常有帮助。

【问题讨论】：

窗口未定义服务器端。确定哪些代码使用它（您的或图书馆的）。如果它是你的，用isPlatformBrowser 条件包装它，否则尝试模拟窗口对象

你找到解决办法了吗，我也遇到了同样的问题

【参考方案1】：

尝试使用 domino ，这将支持 Angular s-s-r 中的许多不一致。

在server.ts

const domino = require('domino');
const win = domino.createWindow(template);

global['window'] = win;
global['document'] = win.document;
global['navigator'] = win.navigator;
global['CSS'] = undefined;