svgoを使うとsvgファイルがおよそ50%軽量化されるのでその使い方をまとめました。
macのterminalを使って実践します。
フロー
- svgoをインストール
- svgoコマンドを使ってsvgを軽量化
svgoをインストール
command
$ [sudo] npm install --save-dev svgo
$ svgo -v // バージョン表示確認
svgoを使う
・svgファイル1枚ずつを軽量化
command
// svgを格納しているディレクトリまで移動
$ svgo test.svg // test.svgが軽量化
$ svgo test2.svg test2-min.svg // test2.svgがtest2-min.svgと名前を変えて軽量化
・フォルダに格納されているsvgファイルを軽量化
command
$ svgo -f hoge // hogeディレクトリに格納されている全てのsvgが軽量化
$ svgo -f hoge -o hogehoge // 新たにhogehogeディレクトリを作ってそこに軽量化されたsvgを移動
・コメントを削除して複数のソースコードのパスをマージして軽量化
command
$ svgo test.svg --enable='removeComments,mergePaths' // ファイル1枚を軽量化
$ svgo -f hoge --enable='removeComments,mergePaths' // ディレクトリを軽量化