nameLazyFiles - ugly/unexpected names

Versions

@ngtools/webpack: 6.0.0-beta.4

Repro steps

• Create app with lazy loaded routes where modules are in some subdirectory (not in the root directory).
• Compile app using webpack AngularCompilerPlugin with nameLazyFiles set to true + output.chunkFilename set to ‘[name].chunk.js’,

Observed behavior

Relative filesystem path to the compiled module is:
.\SubjectCommon\js\controllers\credit\credit.module.ts
and the name of the coresponding chunk is:
SubjectCommon-js-controllers-credit-credit-module-ngfactory.chunk.js

Desired behavior

Chunk name should be:
credit.module.chunk.js

Mention any other details that might be useful (optional)

I belive that option “nameLazyFiles” should replace existing plugin NamedLazyChunksWebpackPlugin (from previous version of CLI). But it works differently. NamedLazyChunksWebpackPlugin generated correct name “credit.module.chunk.js”. The problem is on this line:

https://github.com/angular/angular-cli/blob/71f38222c02f0a25c6278cd256663f9e8812a8bb/packages/%40ngtools/webpack/src/angular_compiler_plugin.ts#L598

“importPath” contains path to the factory file without any extension (regex is not correct because it expect extension). And just the name of the factory file should be used. Not whole path.

[mackelito]

we are having issue that I belive might be related… When building the naming becomes like: chunk {5} contact-us-contact-us-module-ngfactory.js, contact-us-contact-us-module-ngfactory.js.map (contact-us-contact-us-module-ngfactory) 10.1 kB [rendered]

But then we also have another strange file being generated… chunk {2} default~checkout-checkout-module-ngfactory~registration-registration-module-ngfactory.js, default~checkout-checkout-module-ngfactory~registration-registration-module-ngfactory.js.map (default~checkout-checkout-module-ngfactory~registration-registration-module-ngfactory) 23.8 kB [rendered]

By the looks of the naming it looks like it has merged 2 modules?

I believe that this is causing our site to crash currently…

[cexbrayat]

@clydin I understand the benefit you’re pointing out, but for the common case, it’s a bit weird.

If you have a single module UsersModule in a sub-directory modules/users, we used to have a file named users.module.chunk.js and now we have a modules-users-users-module-ngfactory.js file. Which is (I think) less readable (even without the ngfactory bit).

And maybe that should probably be noted in the breaking changes, as some users might rely on the former names to do some things in their builds (like tracking build sizes…)?