Angular UniversalでSSR/Prerenderするときに躓いたら確認したい４つの方針

            window is not defined
document is not defined
setTimout is not defined
#...などなど

        

            $ npm install domino
#OR
$ yarn add domino -S

        

            const domino = require('domino');
const fs = require('fs');
const path = require('path');

//ビルドした際に出力されたindex.htmlを擬似DOMテンプレートとして読み込む
const template = fs.readFileSync(path.join(__dirname, '.', 'dist', 'index.html')).toString();

//windowグローバルオブジェクトとdocumentグローバルオブジェクトを設定する
const window = domino.createWindow(template);
global['window'] = window;
global['document'] = window.document;

export { AppServerModule } from './app/app.server.module';
export { renderModule, renderModuleFactory } from '@angular/platform-server';

        

            import { Component, Input, OnInit, ViewChild, ElementRef } from '@angular/core';

import { AwesomeRenderService } from './awesome-render.service';

@Component({
    selector: 'awesome-dom',
    template: `
    <span #tex_area></span>
    `,
    styleUrls: ['./awesome-dom.component.scss']
})
export class AwesomeDomComponent implements OnInit {

    @Input() data: any;

    @ViewChild('tex_area', {
        read: ElementRef,
        static: true
    }) elementRef: ElementRef;

    constructor(private awsomeRenderer: AwesomeRenderService) {}

    ngOnInit() {
        if (this.data) {
            // AwesomeRenderServiceクラスのrenderメソッドの引数にネイティブDOMを指定する
            this.awsomeRenderer.render(this.data.text, this.elementRef.nativeElement);
        }
    }