Library build not minified

[exoduscloudtech]

Command

build

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

Not tried this in previous versions

Description

When performing ng build or ng build --configuration=production, Angular creates a main..js, a polyfills..js, and a runtime.*.js file all of which are flattened and minified.

When performing ng build or ng build --configuration=production on a standalone Angular component, currently the fesm2015 and fesm2020 folders in the destination folder hold *.mjs and *.mjs.map files, where neither file holds "flattened" code. The standalone component code is easily readable. ng build should flatten the output code, and --configuration=production should minify the flattened code.

According to:
https://angular.io/guide/angular-package-format

"To generate a flattened ES Module index file, use the following configuration options in your tsconfig.json file":

"angularCompilerOptions": {
...
"flatModuleOutFile": "my-ui-lib.js",
"flatModuleId": "my-ui-lib"
}

This does not flatten the output from ng build.

2 REQUESTS:

1. Can ng build flatten the output of standalone component libraries?
2. Can ng build --configuration=production minify the flattened output, as in the case of any other Angular application?

Minimal Reproduction

Run
ng build my-library-name

Or
ng build my-library-name --configuration=production

Exception or Error

No error to show

Your Environment

Angular CLI: 15.0.0
Node: 16.15.1
Package Manager: npm 8.11.0
OS: win32 x64

Angular: 15.0.0
... animations, cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router

Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1500.0
@angular-devkit/build-angular 15.0.0
@angular-devkit/core 15.0.0
@angular-devkit/schematics 15.0.0
@schematics/angular 15.0.0
ng-packagr 15.0.0
rxjs 7.5.7
typescript 4.8.4

Anything else relevant?

No response

[JoostK]

I am a bit confused by what this issue is reporting.

1. What does "standalone component" mean in this context? It seems like you're referring to a library build in general, unrelated to standalone components.
2. What do you mean by "flattened" code, given that you mention that fesm20## files are generated? Flattening means that multiple ECMAScript modules are concatenated into a single .mjs file.

Minification is not done for library builds, that only happens during application builds.

Could you perhaps share a repro that showcases what you're experiencing?

[exoduscloudtech]

I have built several libraries and would like to distribute those via NPMJS. I however would like to hide the underlying code though. Will change the title from "standalone component" to "library".

If flattening is about bringing all files into a single JS file, then there's no problem on this front.

Why are library builds not minified? Can they be?

[alan-agius4]

Minification of libraries is done during the application build, this is for a number of reasons, such as it's easier to debug, minifying an already minified library can cause breakages, and it make it harder to statically analyse and perform additional optimisations.

With minification you are not "hiding" any code, you are just making it smaller and harder to read. If code protection is a your primary goal. The use of a SPA itself may not be the best choice and a server based web framework may be better.

[angular-automatic-lock-bot]

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.}