changes to server.ts

server.ts

@@ -1,3 +1,20 @@
+/**
+ * *** NOTE ON IMPORTING FROM ANGULAR AND NGUNIVERSAL IN THIS FILE ***
+ *
+ * If your application uses third-party dependencies, you'll need to
+ * either use Webpack or the Angular CLI's `bundleDependencies` feature
+ * in order to adequately package them for use on the server without a
+ * node_modules directory.
+ *
+ * However, due to the nature of the CLI's `bundleDependencies`, importing
+ * Angular in this file will create a different instance of Angular than
+ * the version in the compiled application code. This leads to unavoidable
+ * conflicts. Therefore, please do not explicitly import from @angular or
+ * @nguniversal in this file. You can export any needed resources
+ * from your application's main.server.ts file, as seen below with the
+ * import for `ngExpressEngine`.
+ */
+
 import 'zone.js/dist/zone-node';
 import 'reflect-metadata';
 import 'rxjs';
@@ -10,15 +27,18 @@ import * as express from 'express';
 import * as bodyParser from 'body-parser';
 import * as compression from 'compression';
 import * as cookieParser from 'cookie-parser';
+import { join } from 'path';
 
 import { enableProdMode, NgModuleFactory, Type } from '@angular/core';
 
-import { ngExpressEngine } from '@nguniversal/express-engine';
-
 import { REQUEST, RESPONSE } from '@nguniversal/express-engine/tokens';
 import { environment } from './src/environments/environment';
 
-export function startServer(bootstrap: Type<{}> | NgModuleFactory<{}>) {
+const DIST_FOLDER = join(process.cwd(), 'dist/browser');
+
+// * NOTE :: leave this as require() since this file is built Dynamically from webpack
+const { ServerAppModuleNgFactory, LAZY_MODULE_MAP, ngExpressEngine, provideModuleMap } = require('./dist/server/main');
+
 const app = express();
 
 if (environment.production) {
@@ -33,7 +53,7 @@ export function startServer(bootstrap: Type<{}> | NgModuleFactory<{}>) {
 
 app.engine('html', (_, options, callback) =>
   ngExpressEngine({
-      bootstrap: bootstrap,
+    bootstrap: ServerAppModuleNgFactory,
     providers: [
       {
         provide: REQUEST,
@@ -43,13 +63,14 @@ export function startServer(bootstrap: Type<{}> | NgModuleFactory<{}>) {
         provide: RESPONSE,
         useValue: (options as any).req.res,
       },
+      provideModuleMap(LAZY_MODULE_MAP)
     ],
   })(_, (options as any), callback)
 );
 
 app.set('view engine', 'ejs');
 app.set('view engine', 'html');
-  app.set('views', 'src');
+app.set('views', DIST_FOLDER);
 
 function cacheControl(req, res, next) {
   // instruct browser to revalidate
@@ -80,13 +101,13 @@ export function startServer(bootstrap: Type<{}> | NgModuleFactory<{}>) {
   function onHandleError(parentZoneDelegate, currentZone, targetZone, error) {
     if (!res._headerSent) {
       console.warn('Error in SSR, serving for direct CSR. Error details : ', error);
-        res.sendFile('index.csr.html', { root: './src' });
+      res.sendFile('index.csr.html', { root: DIST_FOLDER });
     }
   }
 
   if (environment.universal.preboot) {
     Zone.current.fork({ name: 'CSR fallback', onHandleError }).run(() => {
-        res.render('../dist/index.html', {
+      res.render(DIST_FOLDER, {
         req,
         res,
         preboot: environment.universal.preboot,
@@ -100,12 +121,14 @@ export function startServer(bootstrap: Type<{}> | NgModuleFactory<{}>) {
   } else {
     console.log('Universal off, serving for direct CSR');
     res.render('index-csr.ejs', {
-        root: './src',
+      root: DIST_FOLDER,
       scripts: `<script>window.dspace = ${JSON.stringify(dspace)}</script>`
     });
   }
 }
 
+app.get('*.*', ngApp);
+
 function serverStarted() {
   console.log(`[${new Date().toTimeString()}] Listening at ${environment.ui.baseUrl}`);
 }
@@ -154,4 +177,4 @@ export function startServer(bootstrap: Type<{}> | NgModuleFactory<{}>) {
   app.listen(environment.ui.port, environment.ui.host, () => {
     serverStarted();
   });
-  }}
+}