CODEWITHSUNDEEP
javascriptvue.jswebpack
markWanka
markWanka

Reputation: 784

Chunk-vendors files is too big on production

After production build my vue.js app, i saw that my chunk-vendors files are too big and this have an impact on web performance, screen below:

enter image description here

how to reduce size of this files?

I try to import component in my router.js via lazy loading but not help here, what is another solution to this problem?

thanks for any help!

Upvotes: 10

Views: 13554

Answers (1)

floodlitworld
floodlitworld

Reputation: 626

Further to the previous comments, you likely need to analyse what is being imported into your app.

A good way to do this is through a dependency analysis. If you're using vue-cli, you can add Webpack Bundle Analysis to your devDependencies. This will allow you to see what is being imported.

Pay special attention to things like icon libraries (like @mdi) and other helper libraries like @vueuse or lodash. If they're imported incorrectly, you can end up with the entire package rather than treeshaking out only the ones used.

Upvotes: 3

Related Questions