No provider for ORIGIN_URL

[asadsahi]

Just downloaded the project and run npm run build:prerender

Getting this error:

> universal-demo@0.0.0 build:prerender C:\Users\Asad\dev\angular-universal-starter
> npm run build:universal && npm run generate:prerender


> universal-demo@0.0.0 build:universal C:\Users\Asad\dev\angular-universal-starter
> ng build --prod && ng build --prod --app 1 && webpack --progress --colors

Date: 2017-12-20T22:52:54.083Z
Hash: cecbb91e3052017c795d
Time: 25576ms
chunk {0} 0.e75f5d2936d757b487a2.chunk.js () 2.19 kB  [rendered]
chunk {1} 1.5b90f194905b0bf2a04d.chunk.js () 2.04 kB  [rendered]
chunk {2} 2.e2f0158643a96b8ec76a.chunk.js () 1.38 kB  [rendered]
chunk {3} polyfills.679a60ec87f0920e9e75.bundle.js (polyfills) 65.6 kB [initial] [rendered]
chunk {4} main.4f7db7641c744554fa2a.bundle.js (main) 377 kB [initial] [rendered]
chunk {5} styles.d41d8cd98f00b204e980.bundle.css (styles) 0 bytes [initial] [rendered]
chunk {6} inline.3ff0641c92ccc4218a55.bundle.js (inline) 1.52 kB [entry] [rendered]
Date: 2017-12-20T22:53:02.164Z
Hash: ba586c625d49e8b26495
Time: 5531ms
chunk {0} main.8e71a9c5d78f523d505e.bundle.js (main) 26.4 kB [entry] [rendered]
chunk {1} styles.d41d8cd98f00b204e980.bundle.css (styles) 0 bytes [entry] [rendered]
Hash: 2114cc80462b683457f9
Version: webpack 3.10.0
Time: 2688ms
       Asset     Size  Chunks                    Chunk Names
   server.js  5.04 MB       0  [emitted]  [big]  server
prerender.js  4.32 MB       1  [emitted]  [big]  prerender
  [90] ./src lazy 160 bytes {0} {1} [built]
 [145] ./dist-server ^\.\/main\..*\.bundle$ 199 bytes {0} {1} [built]
 [146] ./dist-server/main.8e71a9c5d78f523d505e.bundle.js 26.4 kB {0} {1} [optional] [built]
 [228] ./server.ts 3.73 kB {0} [built]
 [278] ./src 160 bytes {0} [built]
 [284] (webpack)/buildin/module.js 517 bytes {0} [built]
 [297] ./prerender.ts 2.94 kB {1} [built]
 [298] ./static.paths.ts 49 bytes {1} [built]
    + 291 hidden modules

> universal-demo@0.0.0 generate:prerender C:\Users\Asad\dev\angular-universal-starter
> node prerender.js

ERROR { Error: Uncaught (in promise): Error: StaticInjectorError[ORIGIN_URL]:
  StaticInjectorError[ORIGIN_URL]:
    NullInjectorError: No provider for ORIGIN_URL!
Error: StaticInjectorError[ORIGIN_URL]:
  StaticInjectorError[ORIGIN_URL]:
    NullInjectorError: No provider for ORIGIN_URL!
    at _NullInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1655:19)
    at resolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1943:24)
    at tryResolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1885:16)
    at StaticInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1756:20)
    at resolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1943:24)
    at tryResolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1885:16)
    at StaticInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1756:20)
    at resolveNgModuleDep (C:\Users\Asad\dev\angular-universal-starter\prerender.js:11545:25)
    at NgModuleRef_.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:12773:16)
    at resolveNgModuleDep (C:\Users\Asad\dev\angular-universal-starter\prerender.js:11545:25)
    at resolvePromise (C:\Users\Asad\dev\angular-universal-starter\prerender.js:107893:31)
    at resolvePromise (C:\Users\Asad\dev\angular-universal-starter\prerender.js:107864:17)
    at C:\Users\Asad\dev\angular-universal-starter\prerender.js:107942:17
    at ZoneDelegate.invokeTask (C:\Users\Asad\dev\angular-universal-starter\prerender.js:107494:31)
    at Object.onInvokeTask (C:\Users\Asad\dev\angular-universal-starter\prerender.js:5409:33)
    at ZoneDelegate.invokeTask (C:\Users\Asad\dev\angular-universal-starter\prerender.js:107493:36)
    at Zone.runTask (C:\Users\Asad\dev\angular-universal-starter\prerender.js:107261:47)
    at drainMicroTaskQueue (C:\Users\Asad\dev\angular-universal-starter\prerender.js:107671:35)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
  rejection:
   { Error: StaticInjectorError[ORIGIN_URL]:
  StaticInjectorError[ORIGIN_URL]:
    NullInjectorError: No provider for ORIGIN_URL!
    at _NullInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1655:19)
    at resolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1943:24)
    at tryResolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1885:16)
    at StaticInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1756:20)
    at resolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1943:24)
    at tryResolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1885:16)
    at StaticInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1756:20)
    at resolveNgModuleDep (C:\Users\Asad\dev\angular-universal-starter\prerender.js:11545:25)
    at NgModuleRef_.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:12773:16)
    at resolveNgModuleDep (C:\Users\Asad\dev\angular-universal-starter\prerender.js:11545:25)
     ngTempTokenPath: null,
     ngTokenPath: [ 'ORIGIN_URL' ],
     __zone_symbol__currentTask:
      ZoneTask {
        _zone: [Object],
        runCount: 0,
        _zoneDelegates: null,
        _state: 'notScheduled',
        type: 'microTask',
        source: 'Promise.then',
        data: undefined,
        scheduleFn: undefined,
        cancelFn: null,
        callback: [Function],
        invoke: [Function] } },
  promise:
   ZoneAwarePromise {
     __zone_symbol__state: 0,
     __zone_symbol__value:
      { Error: StaticInjectorError[ORIGIN_URL]:
  StaticInjectorError[ORIGIN_URL]:
    NullInjectorError: No provider for ORIGIN_URL!
    at _NullInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1655:19)
    at resolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1943:24)
    at tryResolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1885:16)
    at StaticInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1756:20)
    at resolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1943:24)
    at tryResolveToken (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1885:16)
    at StaticInjector.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:1756:20)
    at resolveNgModuleDep (C:\Users\Asad\dev\angular-universal-starter\prerender.js:11545:25)
    at NgModuleRef_.get (C:\Users\Asad\dev\angular-universal-starter\prerender.js:12773:16)
    at resolveNgModuleDep (C:\Users\Asad\dev\angular-universal-starter\prerender.js:11545:25)
        ngTempTokenPath: null,
        ngTokenPath: [Array],
        __zone_symbol__currentTask: [Object] } },
  zone:
   Zone {
     _properties: { isAngularZone: true },
     _parent:
      Zone {
        _properties: {},
        _parent: null,
        _name: '<root>',
        _zoneDelegate: [Object] },
     _name: 'angular',
     _zoneDelegate:
      ZoneDelegate {
        _taskCounts: [Object],
        zone: [Circular],
        _parentDelegate: [Object],
        _forkZS: null,
        _forkDlgt: null,
        _forkCurrZone: [Object],
        _interceptZS: null,
        _interceptDlgt: null,
        _interceptCurrZone: [Object],
        _invokeZS: [Object],
        _invokeDlgt: [Object],
        _invokeCurrZone: [Circular],
        _handleErrorZS: [Object],
        _handleErrorDlgt: [Object],
        _handleErrorCurrZone: [Circular],
        _scheduleTaskZS: [Object],
        _scheduleTaskDlgt: [Object],
        _scheduleTaskCurrZone: [Circular],
        _invokeTaskZS: [Object],
        _invokeTaskDlgt: [Object],
        _invokeTaskCurrZone: [Circular],
        _cancelTaskZS: [Object],
        _cancelTaskDlgt: [Object],
        _cancelTaskCurrZone: [Circular],
        _hasTaskZS: [Object],
        _hasTaskDlgt: [Object],
        _hasTaskDlgtOwner: [Circular],
        _hasTaskCurrZone: [Circular] } },
  task:
   ZoneTask {
     _zone:
      Zone {
        _properties: [Object],
        _parent: [Object],
        _name: 'angular',
        _zoneDelegate: [Object] },
     runCount: 0,
     _zoneDelegates: null,
     _state: 'notScheduled',
     type: 'microTask',
     source: 'Promise.then',
     data: undefined,
     scheduleFn: undefined,
     cancelFn: null,
     callback: [Function],
     invoke: [Function] } }

I am using windows 10.

I am working in an another node-angular-ssr project and having exact error with url, in my case I have named it "BASE_URL", but it fails during prerender generation phase. Wondering if there is an environment related issue going on here.

[Gorniv]

fix it 3d589fc

[asadsahi]

@Gorniv thank, it has indeed. What pattern do you reckon about generating these pre-rendered pages? during development or production. Hardcoding URL suggest that we need to host the url because if pages use any http request to get data, pre-render fails since it cannot find any site on that url yet.

When deployed on production, url will exist so pre-render can get the data. Also have you given any thoughts on caching strategy of dynamic or pre-renderd page? what are the options?

[Gorniv]

Prerender build pages with all content one time. Value of ORIGIN_URL depends on your page and logic. You use angular with current ORIGIN_URL of web browser page after prerender. I think that prerender page needs a very simple site like landing. I use dynamic server-side render with node.

[asadsahi]

@Gorniv in your case you aren't using ORIGIN_URL during SSR/Prerender but in my case I get some data fetched from server when application initialises, therefore in order to build these pre-rendered pages, I have to make a working ORIGIN_URL. And it works if I have ORIGIN_URL serving the data.

Having site pre-rendered already for all urls surely boost performance since there isn't any server side execution.

Does following code works for both pre-rendering and dynamic rendering?

 const { AppServerModuleNgFactory, LAZY_MODULE_MAP } = require(`./dist/server/main.bundle`);
      this.app.engine('html', ngExpressEngine({
        bootstrap: AppServerModuleNgFactory,
        providers: [
          provideModuleMap(LAZY_MODULE_MAP)
        ]
      }));

Does it try to get pre-render page and then falls back to dynamic rendering?

[Gorniv]

@asadsahi if you want to use prerender and dynamic rendering you need change server.ts. Server.ts need use a different route for prerendering and dynamic route. I will think about add example in the repository.
I add environment in prerender.ts

[asadsahi]

@Gorniv If you don't generate prerender pages then existing setup does dynamic rendering. I am not using 100% your server.ts and prerender.ts but I think ngExpressEngine falls back to dynamic rendering if prerender pages aren't found.

Your setup matches quite close to angular-universal starter and thats what I am following and just proved the concept described above.

[Gorniv]

'node server.js' dont use prerender. Prerender is alternative for use static with seo and angular.
Look https://github.com/AngularClass/universal-sitegen

[asadsahi]

Ahh I see, so does that mean with current setup it always use dynamic-rendering? pre-render pages are only if someone wants to use static pages?

[Gorniv]

@asadsahi yes, subscribe to #8

[asadsahi]

Thanks @Gorniv