Polymer / polymer

Our original Web Component library.
https://polymer-library.polymer-project.org/
BSD 3-Clause "New" or "Revised" License
22.05k stars 2.01k forks source link

Getting Windows undefined with using Angular11 server side rendering #5729

Open jz1494 opened 3 months ago

jz1494 commented 3 months ago

Getting Windows undefined with using Angular11 server side rendering

Screenshot-291-

Also getting TypeError: Cannot read property 'polyfillWrapFlushCallback' of undefined Screenshot (292)

Another one is TypeError: Cannot redefine property: constructor Screenshot-293-

Is there any solution for this?

Here si my server.ts

import 'zone.js/dist/zone-node';

import { ngExpressEngine } from '@nguniversal/express-engine';
import * as express from 'express';
import { join } from 'path';
import 'node-self';
const domino = require('domino');
// const fs = require('fs');
import * as fs from 'fs';
// import { existsSync } from 'fs';
// import * as domino from 'domino';
// const template = fs.readFileSync(path.join(distFolder, 'index.html')).toString();
// Shim for the global window and document objects.
const distFolder = join(process.cwd(), 'dist/browser');
const indexHtml = fs.existsSync(join(distFolder, 'index.original.html')) ? 'index.original.html' : 'index';
// const template = fs.readFileSync(join(distFolder, indexHtml)).toString();
const win = domino.createWindow(indexHtml);
// console.log('Win==>',win);
global['window'] = win;
// global['self'] =  win;
global['document'] = win.document;
global['HTMLElement'] = win.HTMLElement;
global['navigator'] = win.navigator;

import { AppServerModule } from './src/main.server';
import { APP_BASE_HREF } from '@angular/common';

// The Express app is exported so that it can be used by serverless Functions.
export function app(): express.Express {
  const server = express();

  console.log('server side');

  const path = require('path');

  // Our Universal express-engine (found @ https://github.com/angular/universal/tree/master/modules/express-engine)
  server.engine('html', ngExpressEngine({
    bootstrap: AppServerModule,
  }));

  server.set('view engine', 'html');
  server.set('views', distFolder);

  // Example Express Rest API endpoints
  // server.get('/api/**', (req, res) => { });
  // Serve static files from /browser
  server.get('*.*', express.static(distFolder, {
    maxAge: '1y'
  }));

  /* server.get('*', function (req, res) {
    res.sendFile(join(distFolder, 'browser', 'index.html'));
  }); */

  // All regular routes use the Universal engine
   server.get('*', (req, res) => {
    res.render(indexHtml, { req, providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }] });
  });

  return server;
}

Versions

Polymer.version : 3.4.1 Angular version : 11 webcomponents : 2.5.0