Analyzing bundle size

When an Angular application is build for production (ng build –prod), the CLI build creates multiples bundles in the dist folder. Source-map-explorer is a tool to figure out what libraries make the size of these bundles. First it has to be installed:

npm i -g source-map-explorer

Then, a production build can be performed with the sourcemaps flag set to true:

ng build —-prod —-sourcemaps=true

As soon as the build has finished, source-maps can be shown in a web browser as follows:

source-map-explorer bundle-name.js

It will display something like that:

Capture

Werbung

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit deinem WordPress.com-Konto. Abmelden /  Ändern )

Facebook-Foto

Du kommentierst mit deinem Facebook-Konto. Abmelden /  Ändern )

Verbinde mit %s