このシリーズ、記事化がマジで大変。

いつかきっと誰かの役に立つことを祈ってまとめます。



electron-icon-builderを使ってラクラクアイコン生成

アイコン生成には、electron-icon-builderというライブラリを入れておくのがおすすめです。

$ npm install electron-icon-builder

と言うコマンドでインストールしておきましょう。



$ ./node_modules/.bin/electron-icon-builder --input=/absolute/path/file.png --output=./relative/path/to/folder

という形でコマンドを叩くと、一括で必要なアイコンが生成されます。
--inputのところで、アイコンにしたいpngのある絶対パスを指定して、
--outputのところで、生成したアイコンの出力先のフォルダを指定しておきます。

electron-icon-builderのアイコン生成結果



画像にはwebpは使えません。

1024px x 1024px以上の正方形の画像を使うようにしてください。

ちなみに、透過画像でも問題なく出力できました。

アイコン設定
こんな感じで。




package.jsonでの指定方法

package.jsonで、以下のようにそれぞれ指定すればOKです。
パスは適宜合わせてください。


"build": {
 "mac": {
      "icon": "icons/mac/icon.icns",
    },
    "win": {
      "icon": "icons/win/icon.ico"
    },
    "linux": {
      "icon": "icons/png/icon.png"
    }
}