Electron shows white screen when built

I had a similar problem when I tried to build for windows.

While the win.loadURL(...) seems to work like that in development, maybe try to change it to this when building:

win.loadURL(url.format({
  pathname: path.join(__dirname, 'index.html'),
  protocol: 'file:',
  slashes: true
}));

This makes sure it definitly gets the right path to your index.html file.

For the path.join(...) and url.format(...) to work you need to require them first:

const path = require('path');
const url = require('url');

I don't know about the build process especially, I had also the same problem on development, that electron shows nothing but a blank screen (probably because I clicked a link that was not available earlier).

After rebuilding and what else nothing was shown on the screen.

The final hack that worked for me was clearning my Appdata from system.

In my case I had linux I cleared the app data by going to ~/.config/myApp

Windows: C:\Users\<user>\AppData\Roaming\<yourAppName>\Cache

OSX: /Users/<user>/Library/Application Support/<yourAppName>/Cache

Hope it will help someone in need.

In my case the build showed a white site as well. For those who are using React Router in their project this solution might be helpful.

My startUrl variable looks like this:

const startUrl = process.env.ELECTRON_START_URL || url.format(
 {
    pathname: path.join(__dirname, '/../build/index.html'),
    protocol: 'file:',
    slashes: true
 });

For me the solution was to move from BrowserRouter to HashRouter in your App.js as mentioned in this thread

render() 
{
  return (
     <Provider store = { store }>
        <HashRouter>
           <Switch>
              <Route exact path='/' component={Home} />
              <Route exact path='/Login' component={Login} />
           </Switch>
        </HashRouter>
     </Provider>
  );
}

i recently face white screen issue in my case little bit difference

i used vue framework with router(router must be hash)

1.for vue.js with vue router in electron

const router = new VueRouter({
  mode: 'hash',
  routes: [...]
})

2.for react.js with react router in electron

hashrouter

instead of

BrowserRouter

without any framework

check entry point url placed correctly

 win.loadURL('app://./index.html')