Electron-builder with webpack

Question

tl,dr:

Here's what I got:

• Electron

• React

• Webpack

• electron-builder

• electron-edge

• node-fibers

• some static assets (.png, .svg etc.)

Here's what I want:

• A crossplatform autoupdating installer for the software

The long version and the problems:

I can get Electron, React, Electron Edge, node-fibers, webpack and the static assets to run perfectly when I start the webpackserver in dev mode.

However, how can I integrate this into electron-builder?

I'm new to this whole build process and I just took this boilerplate to get started: Github of the boilerplate

To me, the dev debug process seems to go like this:

• Have webpack create a bundle.js and an index.html out of my src folder

• Start a webpackserver with hot mode that serves these files

However, how should I tell electron-builder where to get the different files from? There is no package.json nor node_modules/ inside dist/ and node-fibers isn't getting bundled as well (because webpack seems to fck with __dirname or smth, so I excluded it).

Whenever I launch the generated .exe file (that's not the installer, just an exe file that's supposed to launch the program), a message appears that main.js can't be found in the app.asar file. I tried extracting it, but it fails before it gets to extract the whole package. Main.js is never needed anyway though, because that was the whole point of having webpack transpile it or am I missing something here?

I have searched all over the internet for hours now, but I don't get all the concepts ..

Could anyone here explain what's wrong with my setup and what I can do to fix that?

Answer 1

I recommend you to use https://github.com/chentsulin/electron-react-boilerplate

If you don't want to use boilerplate for react app, consider to use https://github.com/electron-userland/electron-webpack (but boilerplate is strongly recommended).