electron-vueでアプリを作ってみて、npm run devで開発環境で動かしたときは動いたけど、npm run buildで本番向けにビルドしたときは動かないみたいなことがちょいちょいあったので、それの対応方法です。
ファイルが見つからない
productionビルドの場合はwebpackでバンドルされてdist以下に配置されるので、devのときとディレクトリ構造が異なってきます。 なので__dirnameなどを使ってファイルのパスを指定していると駄目です。
下に記載のように__staticを用いる必要があります
path.join(__static, 'image.png')
ファイルの保存ができない
nedbなどで相対パスでファイルに保存するとproductionビルドでは保存に失敗します。
これは、app.getPath()を使ってplatform固有の保存用のパスを取得する必要があります。
const userData = app.getPath('userData'); db = new Datastore({ filename: `${userData}/db/log.db`, });
Macにインストールしようとするとセキュリティエラーがでる
作ったアプリをdmgファイルからインストールしようとすると、登録されていないアプリの警告ダイアログが表示されます。
これを出ないようにするには証明書をインストールしてビルドする必要があります。
Mac App Storeを通さずにアプリケーションを配布する手順
Apple Developer ProgramからDeveloper ID ApplicationとDeveloper ID Installerを作ってビルドするマシンに入れれば、あとはnpm run buildするとOK
Windows用のアプリが生成されない
デフォルトではMac版しかないので自分で追加する必要があります
package.jsonのscriptsにwindows向けのを追加します。
"scripts": { "build:win": "node .electron-vue/build.js && electron-builder -w",
Macだとビルドするにはwineをインストールする必要がありますので、homebrewなどを使ってインストールしておきましょう。