Angular SSR AoT producing duplicated libs #479

New Issue

fergalmoran · 2025-08-09T17:16:26Z

fergalmoran commented

2025-08-09 17:16:26 +00:00

Originally created by @stephenlautier on 8/23/2017

I've noticed that some 3rd party libraries are being emitted twice within the built files. e.g. one in ClientApp/dist/main-server.js and the other within ClientApp/dist/vendor.js, for libraries such as @ngx-translate/core (even our private ones).
It's including both umd and esm formats, this seems to happen when libs have both main and module provided within their package.json

This is obviously increasing file size and also causing issues e.g. use a different instance of providers since they are defined twice.

I've created a repo with an easy repro.

Run the following

git clone https://github.com/stephenlautier/aot-ssr-duplicate-libs
npm i
npm run build:rel

Open ClientApp/dist/main-server.js and ClientApp/dist/vendor.js
Search for [translate],[ngx-translate] (you should find 2x, one in each file)

Not sure if it's a bug in some dependency (if so it seems @ngtools/webpack) or webpack config within the template

Has anyone encountered this issue? Any help would be appreciated, thanks!

update:
by commenting the below, it's not being duplicated.

// webpack.config.vendor.js
const serverBundleConfig = merge(sharedConfig, {
    target: 'node',
    // resolve: { mainFields: ['main'] }, // <-- comment this

For the starter + the library i've added, it reduces the file size for main-server.js from 8,333 KB down to 8,160 KB. However for our app it going from 5,135 KB up to 11,741 KB, which is a bit worrying.

update 2: the above will break non AOT builds also

*Originally created by @stephenlautier on 8/23/2017* I've noticed that some 3rd party libraries are being emitted twice within the built files. e.g. one in `ClientApp/dist/main-server.js` and the other within `ClientApp/dist/vendor.js`, for libraries such as `@ngx-translate/core` (even our private ones). It's including both `umd` and `esm` formats, this seems to happen when libs have both `main` and `module` provided within their `package.json` This is obviously increasing file size and also causing issues e.g. use a different instance of providers since they are defined twice. I've created a repo with an easy repro. - Run the following ``` git clone https://github.com/stephenlautier/aot-ssr-duplicate-libs npm i npm run build:rel ``` - Open `ClientApp/dist/main-server.js` and `ClientApp/dist/vendor.js` - Search for `[translate],[ngx-translate]` (you should find 2x, one in each file) Not sure if it's a bug in some dependency (if so it seems `@ngtools/webpack`) or webpack config within the template Has anyone encountered this issue? Any help would be appreciated, thanks! **update:** by commenting the below, it's not being duplicated. ```js // webpack.config.vendor.js const serverBundleConfig = merge(sharedConfig, { target: 'node', // resolve: { mainFields: ['main'] }, // <-- comment this ``` For the starter + the library i've added, it reduces the file size for main-server.js from 8,333 KB down to 8,160 KB. However for our app it going from 5,135 KB up to 11,741 KB, which is a bit worrying. **update 2**: the above will break non AOT builds also

fergalmoran closed this issue

2025-08-09 17:16:26 +00:00

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: github/JavaScriptServices#479