ng build -aot error 'entry.split is not a function' on lazy loaded modules #3204

ctrl-brk · 2016-11-19T07:09:44Z

OS?

Windows 10

Versions.

1.0.0-beta.20-4

The log given by the failure.

C:\Projects\Cli>ng build -prod -aot
10% building modules 2/2 modules 0 active entry.split is not a function
TypeError: entry.split is not a function
at Function.ModuleRoute.fromString (C:\Projects\Cli\node_modules@ngtools\webpack\src\plugin.js:24:27)
at C:\Projects\Cli\node_modules@ngtools\webpack\src\plugin.js:244:34
at Array.map (native)
at AotPlugin._processNgModule (C:\Projects\Cli\node_modules@ngtools\webpack\src\plugin.js:243:14)
at C:\Projects\Cli\node_modules@ngtools\webpack\src\plugin.js:217:39
at process._tickCallback (internal/process/next_tick.js:103:7)

Mention any other details that might be useful.

I understand that this feature is still under development but FYI...
Line 24 of node_modules/@ngtools/webpack\src\plugin.js
var split = entry.split('#');
Looks like it expects SystemJs module path like my.module#MyModule
But this format doesn't work with webpack. In order to lazy load modules I use es6-promise-loader and it looks like this:

export function loadMyModule() {
  return require('es6-promise!./my.module')('MyModule');
}
export const appRoutes: Routes = [
    {path: 'my', loadChildren: loadMyModule},
]

So, the entry parameter of ModuleRoute.fromString (line 23) is not a string but rather something like this:

activeStaticSymbol {
  filePath: 'C:/Projects/Cli/src/app/app.routing.ts',
  name: 'loadMyModule',
  members: undefined }

The text was updated successfully, but these errors were encountered:

clydin · 2016-11-20T00:08:30Z

The code you referenced is actually allowing the string format to work.
However, it should also allow for using a function if desired.

brandonroberts · 2016-11-20T04:04:39Z

You don't need to use the function to load modules. The CLI handles this for you if you just provide the string path to the module and its class name.

ctrl-brk · 2016-11-20T04:31:13Z

@brandonroberts like this? {path: 'my', loadChildren: 'my.module#MyModule'}
Not sure about AOT but that doesn't work in dev mode. Cannot find module.
It works with SystemJs, but not with webpack

brandonroberts · 2016-11-20T04:33:22Z

@ctrl-brk You have to provide a relative path e.g. {path: 'my', loadChildren: './path/to/my.module#MyModule'} or a full path e.g. {path: 'my', loadChildren: 'app/full/path/to/my.module#MyModule'}

ctrl-brk · 2016-11-20T04:55:35Z

@brandonroberts Doesn't work for me no matter how I try. Same path works with SystemJs and doesn't with cli/webpack. Is there a way to see a full url it's trying to load the module from?
I thought it's a known issue. I've got the idea of es6-promise-loader from here: http://stackoverflow.com/a/39496473/3211221

brandonroberts · 2016-11-20T05:01:58Z

Are you using the latest version of the CLI? See this commit 27a034d

As far as I know there isn't a "debug" mode for module loading.

ctrl-brk · 2016-11-20T05:45:09Z

Ok, I've got it working in "debug" (I meant non-AOT ;) ) mode. The key is that you HAVE to restart the server (kill ng serve and start it again) for this change to be picked up. Just recompiling on the fly doesn't help. I'll play more with AOT tomorrow.

ctrl-brk · 2016-11-20T08:46:21Z

Well, it's kind of 'tomorrow' now ))
And I'm now facing AppModule is not an NgModule with ng build -prod -aot

achimha · 2016-12-20T07:41:11Z

Is there a workaround for the 'entry.split is not a function' error? After weeks of trials and errors and various fixes and updates to angular-cli, I still cannot get it to produce separate bundles for loadChildren. Everything ends up in the main bundle. Using the above mentioned method with es6-promise-loader works but produces said error. Using b23.

jwuliger · 2016-12-24T03:03:32Z

Same problem as @achimha. ERROR in entry.split is not a function No matter what I try I cannot seem to find the source of this error. I am using CLI 1.0.0-beta.24. Anyone know anything? Thanks!

Rebolon · 2016-12-26T16:55:19Z

i have the same kind of issue with angular-cli beta-24 and angular 2.4.1

previously i had a errors like this
ERROR in Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function
but i fixed them using exported functions : loadChildrenXXX

here is what seems to be the source of the error :

`

 import { Routes } from '@angular/router';
 import { DashboardComponent } from './dashboard/dashboard.component';
 import { ExtensionsComponent } from './extensions/extensions.component';
 import { StoryModule } from './story/story.module';
 import { GeneralModule } from './general/general.module';

export function loadChildrenStory() {
    return StoryModule
};
export function loadChildrenGeneral() {
    return GeneralModule
};

export const ROUTES: Routes = [
    { path: 'dashboard', component: DashboardComponent },
    { path: 'story/:id', loadChildren: loadChildrenStory },
    { path: 'general', loadChildren: loadChildrenGeneral },
    { path: 'extensions', component: ExtensionsComponent },
];

`

…oad routes paths The change avoids the compiler CLI internal API from mismatching the following case as lazy loading ``` import { NonLazyLoadedModule } from './non-lazy-loaded/non-lazy-loaded.module'; export function getNonLazyLoadedModule() { return NonLazyLoadedModule; } export const routes = [ { path: '/some-path', loadChildren: getNonLazyLoadedModule } ]; ``` The output of the check is later passed to `RouteDef.fromString()`, so, it makes sense to be only a string. Fixes angular/angular-cli#3204

filipesilva · 2016-12-29T18:22:32Z

@Meligy seems to working on a fix for this message in angular/angular#13676.

You don't need to manually load lazy modules, webpack will pick it up correctly. See here for an example:

https://github.com/angular/angular-cli/blob/master/tests/e2e/assets/webpack/test-app/app/app.module.ts#L21

…oad routes paths The change avoids the compiler CLI internal API from mismatching the following case as lazy loading ``` import { NonLazyLoadedModule } from './non-lazy-loaded/non-lazy-loaded.module'; export function getNonLazyLoadedModule() { return NonLazyLoadedModule; } export const routes = [ { path: '/some-path', loadChildren: getNonLazyLoadedModule } ]; ``` The output of the check is later passed to `RouteDef.fromString()`, so, it makes sense to be only a string. Fixes angular/angular-cli#3204

maxime1992 · 2017-01-06T14:13:54Z

@Rebolon right now I have exactly your configuration. I use loadChildren but not for lazy loading.
Just to use a module. Have you find a solution or not ? I'm not sure of what you were saying in your last message.

@filipesilva why did you close the issue as it's not fixed yet ?

clydin · 2017-01-06T14:23:46Z

@maxime1992 There is a pending PR in the main angular repo to address your loadChildren issue. It will require a new release of angular to be realized however.

maxime1992 · 2017-01-06T15:16:18Z

@clydin I searched loadChildren in PR and nothing came out. Do you have a link so I can follow that ? :)
Thanks

clydin · 2017-01-06T15:19:40Z

Sure. Both of the following have the fix (second is attempting to fix some other issues as well):

angular/angular#13676
angular/angular#13678

Rebolon · 2017-01-06T15:58:36Z

@maxime1992 need to wait for angular/angular#13676

…oad routes paths The change avoids the compiler CLI internal API from mismatching the following case as lazy loading ``` import { NonLazyLoadedModule } from './non-lazy-loaded/non-lazy-loaded.module'; export function getNonLazyLoadedModule() { return NonLazyLoadedModule; } export const routes = [ { path: '/some-path', loadChildren: getNonLazyLoadedModule } ]; ``` The output of the check is later passed to `RouteDef.fromString()`, so, it makes sense to be only a string. Fixes angular/angular-cli#3204

maxime1992 · 2017-01-20T12:52:47Z

For those who use AOT, there's still an ongoing error.

A fix has been proposed here angular/angular#13909 but it requires you to change some import(s) in your code.

Another issue has been opened angular/angular#14005 to ask if this could be done at built time, without the need to do it by hand.

khryshyn · 2017-02-08T21:29:12Z

Works clear with CLI if we declare full path to the module, include the name of the folder and the module inside + #Hash
loadChildren: './dashboard/dashboard.module#DashboardModule'

…oad routes paths The change avoids the compiler CLI internal API from mismatching the following case as lazy loading ``` import { NonLazyLoadedModule } from './non-lazy-loaded/non-lazy-loaded.module'; export function getNonLazyLoadedModule() { return NonLazyLoadedModule; } export const routes = [ { path: '/some-path', loadChildren: getNonLazyLoadedModule } ]; ``` The output of the check is later passed to `RouteDef.fromString()`, so, it makes sense to be only a string. Fixes angular/angular-cli#3204

angular-automatic-lock-bot · 2019-09-06T17:41:13Z

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

…oad routes paths The change avoids the compiler CLI internal API from mismatching the following case as lazy loading ``` import { NonLazyLoadedModule } from './non-lazy-loaded/non-lazy-loaded.module'; export function getNonLazyLoadedModule() { return NonLazyLoadedModule; } export const routes = [ { path: '/some-path', loadChildren: getNonLazyLoadedModule } ]; ``` The output of the check is later passed to `RouteDef.fromString()`, so, it makes sense to be only a string. Fixes angular/angular-cli#3204

ctrl-brk mentioned this issue Nov 19, 2016

Here's my issue brandonroberts/router-cli-aot#1

Closed

Meligy mentioned this issue Dec 27, 2016

fix(compiler-cli): avoid handling functions in loadChildren as lazy load routes paths angular/angular#13676

Closed

3 tasks

filipesilva closed this as completed Dec 29, 2016

angular-automatic-lock-bot bot locked and limited conversation to collaborators Sep 6, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

ng build -aot error 'entry.split is not a function' on lazy loaded modules #3204

ng build -aot error 'entry.split is not a function' on lazy loaded modules #3204

ctrl-brk commented Nov 19, 2016

clydin commented Nov 20, 2016

brandonroberts commented Nov 20, 2016

ctrl-brk commented Nov 20, 2016

brandonroberts commented Nov 20, 2016

ctrl-brk commented Nov 20, 2016

brandonroberts commented Nov 20, 2016

ctrl-brk commented Nov 20, 2016 •

edited

Loading

ctrl-brk commented Nov 20, 2016

achimha commented Dec 20, 2016

jwuliger commented Dec 24, 2016

Rebolon commented Dec 26, 2016

filipesilva commented Dec 29, 2016

maxime1992 commented Jan 6, 2017

clydin commented Jan 6, 2017

maxime1992 commented Jan 6, 2017

clydin commented Jan 6, 2017

Rebolon commented Jan 6, 2017

maxime1992 commented Jan 20, 2017

khryshyn commented Feb 8, 2017 •

edited

Loading

angular-automatic-lock-bot bot commented Sep 6, 2019

ng build -aot error 'entry.split is not a function' on lazy loaded modules #3204

ng build -aot error 'entry.split is not a function' on lazy loaded modules #3204

Comments

ctrl-brk commented Nov 19, 2016

OS?

Versions.

The log given by the failure.

Mention any other details that might be useful.

clydin commented Nov 20, 2016

brandonroberts commented Nov 20, 2016

ctrl-brk commented Nov 20, 2016

brandonroberts commented Nov 20, 2016

ctrl-brk commented Nov 20, 2016

brandonroberts commented Nov 20, 2016

ctrl-brk commented Nov 20, 2016 • edited Loading

ctrl-brk commented Nov 20, 2016

achimha commented Dec 20, 2016

jwuliger commented Dec 24, 2016

Rebolon commented Dec 26, 2016

filipesilva commented Dec 29, 2016

maxime1992 commented Jan 6, 2017

clydin commented Jan 6, 2017

maxime1992 commented Jan 6, 2017

clydin commented Jan 6, 2017

Rebolon commented Jan 6, 2017

maxime1992 commented Jan 20, 2017

khryshyn commented Feb 8, 2017 • edited Loading

angular-automatic-lock-bot bot commented Sep 6, 2019

ctrl-brk commented Nov 20, 2016 •

edited

Loading

khryshyn commented Feb 8, 2017 •

edited

Loading