↘️
【Vite】esフォーマットのlibモードではスペースや改行をminifyできない
タイトルのとおりです。
結論
ViteのLibモードでESでビルドしたとき、スペースや改行が残る形でバンドルされます。このことは公式ドキュメントにも書いてあります。
pure アノテーションを取り除きツリーシェイクをできなくするため、ライブラリーモードで 'es' フォーマットを使用する場合、build.minify オプションは空白文字をミニファイしないので注意してください。
2025/05現在、 この動作は上書きできません。 ビルドが完全に終わった後に自前でminifyするプラグインを入れるか、viteをやめてrollupなどを直で使いましょう。
これをやってもダメ
- デフォルトのesbuildではなくterserを使っても改善しません。
- vite側のminifierを無効にし、rollup-plugin-terserをrollup側のプラグインに差し込むと、コードサイズは減少しますが、スペースや改行はそのまま残ります(そして、コードの規模によっては、このスペース類のサイズが馬鹿になりません）
この奇怪な挙動を見るに、おそらくですが、生成物をviteが再フォーマットしているのではないでしょうか。viteのソースは読んでいませんが……。
githubにissueは立っていますが、2年以上Openになっており、どうもVite側がサポートすることはなさそうな雰囲気です。同じ悩みを持った人がプラグインのサンプルを掲載しています（筆者未確認）
感想
ESでビルドするケースはまだまだモジュール目的の需要が多く、それ自体のバンドルサイズを削減するよりも、Tree Shakingを優先する仕様のほうが嬉しい場面が多いので、この動作は理にかなっているとは思います。
しかし、ES Modulesがブラウザでも当たり前に使えるようになってきた現在、ブラウザ向けにバンドルサイズを削減したいESというのも需要があると思います。というか、自分がそういうケースを踏んだので記事にしました。
Discussion