Skip to content

[Angular >= 5] lazy module not found if directly accessed #543

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
odahcam opened this issue Jan 24, 2018 · 3 comments · Fixed by #545
Closed

[Angular >= 5] lazy module not found if directly accessed #543

odahcam opened this issue Jan 24, 2018 · 3 comments · Fixed by #545

Comments

@odahcam
Copy link
Contributor

odahcam commented Jan 24, 2018 •
edited
Loading

Looks like lazy modules are only compiled in client bundle, because no chunks are generated for them in server bundle:
image

So, when you try to directly access a lazy module via its URL route, the following error occours:

fail: Microsoft.AspNetCore.NodeServices[0]
      ERROR { Error: Uncaught (in promise): Error: Cannot find module './containers/lazy/lazy.module.ngfactory'.
      Error: Cannot find module './containers/lazy/lazy.module.ngfactory'.
          at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:116304:9
          at t.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7338)
          at Object.onInvoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5027:33)
          at t.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7278)
          at r.run (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:2505)
          at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:576:1693
          at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:8022)
          at Object.onInvokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5018:33)
          at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7943)
          at r.runTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:3196)
          at c (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:576:1179)
          at c (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:576:776)
          at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:576:1684
          at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:8022)
          at Object.onInvokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5018:33)
          at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7943)
          at r.runTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:3196)
          at i (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:296)
          at e.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:9165)
          at o.useG.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:9027)
        rejection:
         Error: Cannot find module './containers/lazy/lazy.module.ngfactory'.
             at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:116304:9
             at t.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7338)
             at Object.onInvoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5027:33)
             at t.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7278)
             at r.run (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:2505)
             at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:576:1693
             at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:8022)
             at Object.onInvokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5018:33)
             at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7943)
             at r.runTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:3196),
        promise:
         t {
           __zone_symbol__state: 0,
           __zone_symbol__value:
            Error: Cannot find module './containers/lazy/lazy.module.ngfactory'.
                at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:116304:9
                at t.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7338)
                at Object.onInvoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5027:33)
                at t.invoke (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7278)
                at r.run (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:2505)
                at C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:576:1693
                at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:8022)
                at Object.onInvokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\main-server.js:5018:33)
                at t.invokeTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:7943)
                at r.runTask (C:\Users\67390\Projects\havan-group\aspnetcore-angular2-universal\ClientApp\dist\vendor.js:569:3196) },
        zone:
         r {
           _properties: { isAngularZone: true },
           _parent:
            r {
              _properties: {},
              _parent: null,
              _name: '<root>',
              _zoneDelegate: [Object] },
           _name: 'angular',
           _zoneDelegate:
            t {
              _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:
         e {
           _zone:
            r {
              _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] } }

Reproduce steps

Just build and run the project, then try to access http://localhost:500/lazy directly.
@odahcam
Copy link
Contributor Author

odahcam commented Jan 24, 2018

I think it is related to angular/angular-cli#6373

@odahcam
Copy link
Contributor Author

odahcam commented Jan 25, 2018

Related: angular/angular-cli#5204 (comment)

@odahcam
Copy link
Contributor Author

odahcam commented Jan 25, 2018

Found the problem: ContextReplacementPlugin, the same as angular/angular-cli#8563 (comment) . Moving this plugin to dev only builds, solves the problem of chunk generation and everything works fine.

@odahcam odahcam mentioned this issue Jan 25, 2018
Merged
MarkPieszak pushed a commit that referenced this issue Jan 25, 2018
@odahcam @MarkPieszak
fix(webpack): moved context replacement plugin to dev builds only (#545)
45d6eaa 
closes #543
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Should fix #543
1 participant
@odahcam