Error: No component factory found for NbSearchFieldComponent.

[denisobrienirl]

Issue type

I'm submitting a ...

• bug report
• feature request

Issue description

Current behavior:
Running compiled(AOT) universal app based on bare bone Nebular UI Started Kit (no major modifications to the default provided code), triggers an error below:

Error: No component factory found for NbSearchFieldComponent. Did you add it to @NgModule.entryComponents?

I have not made any changes to nb-search component, the only reference that exist to it in the project is in the default search action in the ngx-admin header component.

Expected behavior:
No error should be triggered.

Steps to reproduce:
I have built the app using the following tutorial - https://angular.io/guide/universal. There were some issues during the compilation process, but all have been addressed and seem irrelevant to the error message above.

Once the application is launched with 'npm serve:universal' script(as per tutorial), it launches express server and starts the app (no errors at this stage yet).

First attempt to access the app with any browser, spawns the error message mentioned above.

P.S. Interesting to note, that navigating through the app after the initial load does not trigger the error message. Only if a new session started (new tab or new browser used), it triggers the error message again.

Related code:
I'm not quite sure what code is relevant to this issue, but here is an extract from the error message referencing Nebular UI internal logic:

ngComponent: 
   { [Function: NbSearchFieldComponent]
     TYPE_MODAL_ZOOMIN: 'modal-zoomin',
     TYPE_ROTATE_LAYOUT: 'rotate-layout',
     TYPE_MODAL_MOVE: 'modal-move',
     TYPE_CURTAIN: 'curtain',
     TYPE_COLUMN_CURTAIN: 'column-curtain',
     TYPE_MODAL_DROP: 'modal-drop',
     TYPE_MODAL_HALF: 'modal-half',
     decorators: [ [Object] ],
     ctorParameters: [Function],
     propDecorators: 
      { searchType: [Array],
        placeholder: [Array],
        hint: [Array],
        searchClose: [Array],
        search: [Array],
        tabOut: [Array],
        inputElement: [Array],
        showSearch: [Array],
        modalZoomin: [Array],
        rotateLayout: [Array],
        modalMove: [Array],
        curtain: [Array],
        columnCurtain: [Array],
        modalDrop: [Array],
        modalHalf: [Array],
        type: [Array] } } }

For what it's worth, here's my server.ts. Again, not sure it's relevant in this case, but that's the module that controls SSR (the initial rendering of the content on first request to the app).

// These are important and needed before anything else
import 'zone.js/dist/zone-node';
import 'reflect-metadata';

import { enableProdMode } from '@angular/core';

import * as express from 'express';
import { join } from 'path';

const domino = require('domino');
const fs = require('fs');
const path = require('path');
const template = fs.readFileSync(join(process.cwd(), 'dist', 'browser', 'index.html')).toString();
const win = domino.createWindow(template);

global['window'] = win;
global['document'] = win.document;
global['DOMTokenList'] = win.DOMTokenList;
global['Node'] = win.Node;
global['Text'] = win.Text;
global['HTMLElement'] = win.HTMLElement;
global['navigator'] = win.navigator;
global['MutationObserver'] = getMockMutationObserver();

function getMockMutationObserver() {
  return class {
    observe(node, options) {
    }
    disconnect() {
    }
    takeRecords() {
      return [];
    }
  };
}

// Faster server renders w/ Prod mode (dev mode never needed)
enableProdMode();

// Express server
const app = express();

const PORT = process.env.PORT || 3000;
const DIST_FOLDER = join(process.cwd(), 'dist');

// * NOTE :: leave this as require() since this file is built Dynamically from webpack
const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require('./dist/server/main.bundle');

// Express Engine
import { ngExpressEngine } from '@nguniversal/express-engine';
// Import module map for lazy loading
import { provideModuleMap } from '@nguniversal/module-map-ngfactory-loader';

app.engine('html', ngExpressEngine({
  bootstrap: AppServerModuleNgFactory,
  providers: [
    provideModuleMap(LAZY_MODULE_MAP)
  ]
}));

app.set('view engine', 'html');
app.set('views', join(DIST_FOLDER, 'browser'));

// TODO: implement data requests securely
app.get('/api/*', (req, res) => {
  res.status(404).send('data requests are not supported');
});

// Server static files from /browser
app.get('*.*', express.static(join(DIST_FOLDER, 'browser')));

// All regular routes use the Universal engine
app.get('*', (req, res) => {
  res.render(join(DIST_FOLDER, 'browser', 'index.html'), { req });
});

// Start up the Node server
app.listen(PORT, () => {
  console.log(`Node server listening on http://localhost:${PORT}`);
});

Other information:

npm, node, OS, Browser

Node: v8.9.3
npm: v6.0.0
OS: Ubuntu 17.10
Browser: Chrome

Angular, Nebular

Angular: "@angular/core": "~5.2.6"
Nebular: "@nebular/auth": "^2.0.0-rc.7",
         "@nebular/security": "^2.0.0-rc.7",
         "@nebular/theme": "^2.0.0-rc.7"

[nnixaa]

@yggg did you have any similar issues working on SSR?

[somq]

@denisobrienirl Did you find a solution in the end ?
I ran across a ton of issues trying to integrate SSR onto ngx-amin or nebular-starter-kit and I got it now at the state of this issue.
Can you help in any way ?

[denisobrienirl]

@somq No, sir. I have not followed this issue through. It doesn't seem to affect my application at all, so no major focus given. Sorry, can't be more helpful.

[somq]

@denisobrienirl alright, thanks for your answer anyway.

It doesn't seem to affect my application at all,

This is the weird thing here, I'm getting this error about the NbSearchFieldComponent even though it works properly.
This whole SSR thing is waaayyy overcomplicated and obscure...

[malwageddon]

@nnixaa Hi Dmitry,

Feel free to close this issue. I don't think it's relevant anymore.

Cheers,

[denisobrienirl]

ah, damn it... posted under wrong ID... apologies, but the same stands... it's no longer an issue...

[nnixaa]

@denisobrienirl no problem!