Angular 9 SSR - 在哪里设置全局['window']（使用多米诺骨牌）？

Question

升级到 Angular 9 后，当运行 yarn serve:ssr.

时出现错误 ReferenceError: window is not defined

在我们的 Angular 应用程序中，我们使用 Domino 技巧来模拟 window 的 SSR（如 https://github.com/Angular-RU/angular-universal-starter/blob/master/server.ts#L21 中）。

所以在 ng update 之后，我在 server.ts 中导入后添加了这些行：


const distFolder = join(process.cwd(), 'dist/browser');
const indexHtml = existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';

// Emulate browser APIs
const domino = require('domino');
const fs = require('fs');
const templateA = fs.readFileSync(join(distFolder, indexHtml)).toString();

const win = domino.createWindow(templateA);
win.Object = Object;
win.Math = Math;
global['window'] = win;
global['document'] = win.document;

但是，设置 global['window'] 似乎为时已晚或根本没有发生。

您知道在哪里设置 global['window'] 以便 angular 组件和库可以在 SSR 中访问它吗？

Answer 1

我把它放在导入下面和 app() 方法上面


import { ngExpressEngine } from '@nguniversal/express-engine';
import * as express from 'express';
import { join } from 'path';

import { AppServerModule } from './src/main.server';
import { APP_BASE_HREF } from '@angular/common';
import { existsSync, readFileSync } from 'fs';
import * as domino from 'domino';
import * as core from 'express-serve-static-core';


const template = join('browser', 'index.html');
const win = domino.createWindow(template);

global['window'] = win;
global['document'] = win.document;

// The Express app is exported so that it can be used by serverless Functions.
export function app(): core.Express {

Answer 2

我做了两个任务来修复它。

首先 - 在 angular.json 中设置 "optimization": 服务器构建为 false，它有助于找到调用错误的 3d paty 模块

第二 - 我在 server.ts

中向上移动多米诺骨牌

Answer 3

已解决，多亏了这条评论https://github.com/angular/universal/issues/1678#issuecomment-627031128

关键是有行

import { AppServerModule } from './src/main.server';

在定义global['window']

之后

当心编辑器中的自动格式化程序，它通常会自动将导入行放在文件顶部:)

Angular 9 SSR - 在哪里设置全局['window']（使用多米诺骨牌）？

Angular 9 SSR - where to set global['window'] (using domino)?

angular

angular9