Webpack Bundle Analyzerでビルドバンドルファイルを可視化し、分析する (Vue-CLI編)

mayatasomayataso

Webpack Bundle Analyzer を使うことで、ビルド時に生成されるバンドルファイルを可視化し、分析できる。
アプリの初期読み込みを改善したいときに、アプリ内のライブラリに占めるウェイトを知ることができて便利

Vue-CLIの場合、vue create時に環境は整っているため

yarn build --report

と、--reportオプションをつければブラウザでAnalyzerが立ち上がる。