highlight.js で一部の言語のみに対応して webpack のビルドサイズを減らす方法 - Qiita

こんにちは、フロントエンジニアの ku6ryo です。 コード文字列をハイライトしてくれる highlight.js を使う機会があったのですが、highlight.js のライブラリ全体のファイルサイズが大きくて webpack ビルドのサイズを大きくしていたので必要な言語のみ対応して、ビルドサイズを大幅に削減する方法を紹介します。 まず、highlight.js の大きさは webpack で build した場合、Gzip しないとサイズが 746.69 KB、Gzip すると 246.18 KB のサイズがあります。 いずれにしても、とても大きなサイズなことは代わりありませんね（汗） すべての対応言語を読み込んでしまうと、このようなサイズになります。 必要な言語をのみを読み込むには、以下のように必要な言語のファイルのみを読み込む設定ファイルを作ります。例えば、Javascript,