ng build console output shows different chunk sizes than is actually created #3565
Description
OS?
Mac OSX (El Capitan)
Versions.
angular-cli: 1.0.0-beta.22-1
node: 6.9.2
os: darwin x64
Repro steps.
Updated to the latest angular-cli version
ranng build --prod --env=stg --aot --no-sourcemap
comparedngoutput tols -lh ./dist/
Output logs
Problem
Noticed that the ng build output displays the size as almost double of what is actually created. i.e it says the the 0.***.chunk.js is 2.06MB, but the file produced s only 938k. More the 2x the actual size.
Activity
hansl commentedon Dec 15, 2016
That's an interesting issue. @TheLarkInn I'm pretty sure this is a webpack issue. What do you think?
XAMelleOH commentedon Jan 10, 2017
Same for me here. Size reported in
ng buildoutput is 2 or even 3 times bigger than actual sizes.FunnyGhost commentedon Apr 14, 2017
For me it's 4 times higher :)
sumitarora commentedon May 31, 2017
@XAMelleOH @FunnyGhost Is it still an issue?
FunnyGhost commentedon Jun 1, 2017
Yeep. The build output says:
chunk {0} polyfills.c9a100b3d87d91c4b1e0.bundle.js (polyfills) 559 kB {4} [initial] [rendered]
chunk {1} main.5cf6336647718faef5a7.bundle.js (main) 483 kB {3} [initial] [rendered]
chunk {2} styles.401ba8300e14d7c38214.bundle.css (styles) 228 bytes {4} [initial] [rendered]
chunk {3} vendor.a054c48ca5a6abfbcf98.bundle.js (vendor) 4.12 MB [initial] [rendered]
chunk {4} inline.2f37a7929a6d875b1ffe.bundle.js (inline) 0 bytes [entry] [rendered]
and the actual sizes are
-a---- 1-6-2017 12:39 1460 inline.2f37a7929a6d875b1ffe.bundle.js
-a---- 1-6-2017 12:39 173244 main.5cf6336647718faef5a7.bundle.js
-a---- 1-6-2017 12:39 175742 polyfills.c9a100b3d87d91c4b1e0.bundle.js
-a---- 1-6-2017 12:39 154308 styles.401ba8300e14d7c38214.bundle.css
-a---- 1-6-2017 12:39 1663240 vendor.a054c48ca5a6abfbcf98.bundle.js
renevall commentedon Jun 2, 2017
Still happening as of cli 1.1
hansl commentedon Jul 14, 2017
There's a misunderstanding with sizes; these sizes are correct, but they're not what you're looking for.
In webpack, there are 2 sizes: assets and chunks. Assets are the actual outputted file sizes. Chunks are pre-seal and their sizes will always be different. Chunk size is basically the size of all the files in the chunk, before optimization, before adding decorations.
My PR just swap those to display the asset size of the first asset of the chunk. This should be more expected for you guys.
hansl commentedon Jul 14, 2017
BTW, this is why you end up with a
0 bytesinline (which only contains code added by a plugin during the seal step) and CSS that has a size but nothing on disk (because the module itself has JavaScript code around it before ExtractTextPlugin runs and remove it).angular-automatic-lock-bot commentedon Sep 7, 2019
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.