CODEWITHSUNDEEP
angularexpressionic-frameworkserver-side-rendering
Лёша Сугуров
Лёша Сугуров

Reputation: 145

ionic with SSR implementation

Trying to add js function to my ionic project but getting self is not defined error. After trying to add self as global ["self"] = win.self || win; I get an error

ERROR TypeError: Cannot redefine property: constructor . Use the latest version of all required dependencies in the project.

server.ts

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

import { ngExpressEngine } from "@nguniversal/express-engine";
import * as express from "express";
import { join } from "path";
import { enableProdMode } from "@angular/core";
import { AppServerModule } from "./src/main.server";
import { APP_BASE_HREF } from "@angular/common";
import { existsSync } from "fs";

enableProdMode();
export function app(): express.Express {
  const server = express();
  const distFolder = join(process.cwd(), "dist/app/browser");
  const indexHtml = existsSync(join(distFolder, "index.original.html"))
    ? "index.original.html"
    : "index";
  const domino = require("domino");
  const win = domino.createWindow(indexHtml);
  // mock
  global["window"] = win;
  global["self"] = win.self;
  global["document"] = win.document;
  global["navigator"] = win.navigator;
  server.engine("html", ngExpressEngine({ bootstrap: AppServerModule }));

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

  server.get(
    "*.*",
    express.static(distFolder, {
      maxAge: "1y",
    })
  );

  server.get("*", (req, res) => {
    res.render(indexHtml, {
      req,
      providers: [{ provide: APP_BASE_HREF, useValue: req.baseUrl }],
    });
  });
  return server;
}
function run(): void {
  const port = process.env.PORT || 4000;

  const server = app();
  server.listen(port, () => {
    console.log(`Node express server listening on http://localhost:${port}`);
  });
}
declare const __non_webpack_require__: NodeRequire;
const mainModule = __non_webpack_require__.main;
const moduleFilename = (mainModule && mainModule.filename) || "";
if (moduleFilename === __filename || moduleFilename.includes("iisnode")) {
  run();
}
export * from "./src/main.server";

Upvotes: 3

Views: 707

Answers (1)

ilprima
ilprima

Reputation: 61

I'm having the same issue. Added these lines to my server.ts file and after adding global['self'] = win; the error is occurred. Without it self is undefined error is shown.

const domino = require('domino');

const templateA = readFileSync(join(distFolder, indexTemplate)).toString();
const win = domino.createWindow(templateA);
(win as any).Object = Object;
(win as any).Math = Math;
global['self'] = win; //TODO: Is giving ERROR TypeError: Cannot redefine property: constructor at Function.defineProperty
global['window'] = win;
global['win'] = win;
global['branch'] = null;

Upvotes: 3

Related Questions