electron & react: No resource with given URL found, DevTools failed to load SourceMap

For production (mac dmg) builds of my electron app, I am unable to trigger location.reload(), connect to redux-dev-tools, and the sourcemap fails to load.

When the app is loaded, the console warns that it cannot load the sourcemap:

The index.html in the sources says the resource cannot be loaded:

Executing location.reload() causes the app to crash with a white screen and no console logs (this command works in electron dev builds).

My electron code is contained in electron/index.electron.js and the relevant snippets are:

const options = {
    icon: join(__dirname, '../src/common/assets/app-icons/png/256x256.png'),
    webPreferences: {
        nodeIntegration: false,
        preload: join(__dirname, "preload.js")
    }
};
// ...
mainWindow = new BrowserWindow({
  ...options,
  ...windowOptions
});
// ...    
const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: "file://../build/index.html"
});
// ...
mainWindow.loadURL(startUrl);

The relevant package.json snippets:

"homepage": "./",
"scripts": {
  "electron-build:mac": "rm -rf dist/ && yarn build && electron-builder -m",
},
"build": {
    "appId": "appId",
    "extends": null,
    "files": [
      "dist/**/*",
      "build/**/*",
      "node_modules/**/*",
      "src/common/assets/**/*",
      "public/*",
      "electron/**/*"
    ],
    "directories": {
      "buildResources": "./src/common/assets"
    }
  },
"devDependencies": {
  "electron": "^11.3.0",
  "electron-builder": "^22.9.1"

The only thing I can confirm in dev is that running location.reload() successfully reloads the app.

Thanks :)

your url is not valid, you should change this:

const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: "file://../build/index.html"
});

to this

const startUrl = process.env.ELECTRON_START_URL || url.format({
    pathname: "file://${ __dirname}/build/index.html"
});