chrisguttandin / angular-prerender

A command line tool to prerender Angular Apps.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Error: Multiple root routing modules found

tonivrbic opened this issue · comments

I'm still getting an error while adding lazy loaded routes to my Angular project. According to #87 and #82 the error should be fixed, but it isn't.

Error:

UnhandledPromiseRejectionWarning: Error: Multiple root routing modules found C:\Users\Toni\Source\test\universe\src\app\lazy\lazy-routing.module.ts, C:\Users\Toni\Source\test\universe\src\app\app-routing.module.ts
    at findRootModule (C:\Users\Toni\Source\test\universe\node_modules\guess-parser\dist\guess-parser\index.js:419:15)
    at exports.parseRoutes (C:\Users\Toni\Source\test\universe\node_modules\guess-parser\dist\guess-parser\index.js:582:31)
    at prerender (C:\Users\Toni\Source\test\universe\node_modules\angular-prerender\build\node\functions\prerender.js:89:54)

I'm using the following commands to create the project:

ng new universe --routing
cd universe
ng generate universal --client-project universe
ng generate module lazy --route lazy --module app
ng build
ng run universe:server
npx angular-prerender

My environment is:

  • Angular CLI: 8.3.14
  • Node: 12.12.0
  • OS: win32 x64
  • Angular: 8.2.12

And the version of angular-prerender that is being used is 4.1.21.

Is there a workaround or different syntax for adding lazy loaded routes/modules to the project? Are lazy loaded routes actually supported?

Hi @tonivrbic, thanks for reporting this.

I can't reproduce the error. When executing the exact same steps angular-prerender runs successfully on my machine. The only difference is that I'm using a Mac. Therefore I wonder if it could be a '/' vs '\' issue.

There are some file path replacements used by guess-parser which look suspicious.

https://github.com/guess-js/guess/blob/master/packages/guess-parser/src/angular/index.ts#L334
https://github.com/guess-js/guess/blob/master/packages/guess-parser/src/angular/index.ts#L345

Can you please help me debugging this? At first, please install angular-prerender as dev dependency which allows us to mess with the files.

npm i angular-prerender --save-dev

Furthermore, can you please edit the file located at node_modules/guess-parser/dist/guess-parser/index.js?

Line 437 and line 447 should look like this:

var path = (currentPath + '/' + r.path).replace(/\/$/, '');

Can you please replace both lines with these three lines of code:

var path = path_1.join(currentPath, r.path);
if (path.endsWith(path_1.delimiter)) {
    path = path.slice(0, -1);
}

What happens if you execute npx angular-prerender after you made those changes?

After some investigating I've found that it is indeed an issue with mixing Windows and Linux directory separators ('/' and '\') inside the guess-parser.

The problem seems to be on line 43 (https://github.com/guess-js/guess/blob/master/packages/guess-parser/src/angular/index.ts#L43) where paths are compared. The fullPath string has '/' separators, while the child string path has '\' separators.

Thanks for investigating this further. Does it work if you change line 210 of the file located at node_modules/guess-parser/dist/guess-parser/index.js?

Normally it should look like this:

var fullPath = resolvedModule.resolvedFileName;

Can you please try changing it to this:

var fullPath = path_1.join(...resolvedModule.resolvedFileName.split(/\//).map((part) => (part === '') ? path_1.sep : part));

Does that solve the problem?

Yes, that solves the problem.

Does it even work without the modifications I suggested earlier?

Do you want to create a pull request for guess-parser with the fix or should I do it?

The modifications you suggested earlier (yesterday) did not work.

It would be great if you could create a pull request.

Alright, I'll try to do it tomorrow.

Hi @tonivrbic, can you please give v4.1.22 a try? I contains the fix.

I've tested it and it works! 🔥