-1

I'm using the ant-design and simple icons for my vanilla js app. I'm facing with huge imports after I build my app. Currently 3.92mb in minified version. Is there anything I can fix this? I'm using parcel to build my website.

Build:

Build

Package.json

Package

It seems that ant-design and simple icons imports all the icons in the index.js

index.js

enter image description here

enter image description here

This is how I imports the icons:

enter image description here

J.Wujeck
  • 280
  • 4
  • 16

1 Answers1

0

You can tell parcel generate an analysis of what is in your bundle by adding --reporter @parcel/reporter-bundle-analyzer to your parcel build command, which will output an html file with the analysis to the parcel-bundle-reports folder (see docs). That analysis will at least tell you what is the main contributor(s) to the bundle size are.

Parcel does try to remove unused code from your bundle through scope hoisting and tree-shaking (see docs), but there are things that can mess up this process. You can get additional information about whether and why parcel might have had trouble here by adding the --log-level verbose flag to your parcel build command.

Andrew Stegmaier
  • 3,429
  • 2
  • 14
  • 26