How to use Electron-Forge Typescript + webpack plugin with Electron-Builder

Viewed 414

What I did - I'm using electron forge typescript & webpack template . Also I want to use electron-builder instead of Electron-Forge windows maker windows.squirell because of the nsis packaging option.

The Error - The application runs in development mode correctly. However, in the packaged application I get a white screen.

I suspect that the builder is not using the build files generated by "@electron-forge/plugin-webpack"

enter image description here

Electron-Builder Config

  "build": {
    "appId": "cloudapp",
    "win": {
      "target": [
        "nsis"
      ],
      "icon": "./src/images/cloudappLogo Icon.ico",
      "requestedExecutionLevel": "requireAdministrator"
    },
    "nsis": {
      "installerIcon": "./src/images/cloudappIcon.ico",
      "uninstallerIcon": "./src/images/cloudappLogo Icon.ico",
      "uninstallDisplayName": "cloudapp",
      "license": "license.txt",
      "oneClick": false,
      "allowToChangeInstallationDirectory": true
    }
  },

Electron-Forge Config

  "config": {
    "forge": {
      "plugins": [
        [
          "@electron-forge/plugin-webpack",
          {
            "mainConfig": "./webpack/webpack.main.config.js",
            "renderer": {
              "config": "./webpack/webpack.renderer.config.js",
              "entryPoints": [
                {
                  "html": "./public/index.html",
                  "js": "./src/index.tsx",
                  "name": "main_window",
                  "preload": {
                    "js": "./electron/bridge.ts"
                  }
                }
              ]
            }
          }
        ]
      ]
    }
  },
1 Answers

I had to package my files using Electron Forge and built an installer using electron-builder after I packaged app.

Related