You can get a bundle size report just by using Vue CLI and nothing else.
Keeping track of bundle sizes is a best practice. You need to know what gets delivered to users so that you can try to optimize stuff and take corrective steps to decrease chunk sizes, tree-shake where you can etc. All these steps will hopefully lead to smaller bundles or smaller incremental files that should speed up your application (at least in perception!).
A common way of keeping track of bundle sizes is using
webpack-bundle-analyzer. Install this package from NPM and configure a few things in
At least this is the conventional wisdom given out by many. But, you do not need a separate install of bundle analyser - just do a bundle size analysis using Vue CLI and the built-in
webpack-bundle-analyzer does its job quite well.
First, add the following to
script section in your
"build-report": "vue-cli-service build --report",
npm run build-report
See more parameters that give you even more power on Vue CLI docs.