How to build different versions with environment variables

Question

According to this it is not possible to set flags within an electron app with environment variables. I still need to build different versions of the app for dev, staging, pilot and prod.

Internally I would like to use electron-node-config because it's just easy. But because I have no access to environment variables it's not possible to use node-config.

So I thought of having several entry scripts like

// index.dev.js
require('./main')({ APP_URL: 'localhost:8080' });

// index.staging.js
require('./main')({ APP_URL: 'https://staging.foo.com' });

// pilot.staging.js
require('./main')({ APP_URL: 'https://pilot.foo.com' });

Where my main.js file looks more or less like this

module.exports = (config) => {
  app.on('ready', () => {
    mainWindow.loadURL(config.APP_URL);
  });
};

However, in the electron builder docs there doesn't seem to be an option for specifying an entry file, it always uses index.js to package the app, and there isn't much written in the docs for the js api other than

const builder = require('electron-builder');
const env = process.env.NODE_ENV;
const entry = `index.${env}.js`;

builder.build({
  entry,
  appId: 'com.electron.foo',
  productName: 'foo',
  mac: {
    target: 'zip'
  },
  win: {
    target: 'portable'
  },
  portable: {
    artifactName: 'foo.exe'
  }
});

So I tried setting up my package.json like this

"scripts": {
  "build:staging": "NODE_ENV=development node scripts/build",
  "build:pilot": "NODE_ENV=pilot node scripts/build",
  "build:production": "NODE_ENV=production node scripts/build"
}

However I'm really not sure how to set the entry file for electron builder config. How do I specify an entry file?

should be nice for begginers if you make clear on comments that scripts/build is acctually a your build.js. Thanks a lot for this solution — Leonardo Rick
– Leonardo Rick, Commented Mar 11, 2021 at 16:41

Yurii Danylevych · Accepted Answer · 2020-02-05 08:50:22Z

5

You can solve this with electron-build config extraMetadata, you can override package.json properties during build with it.

const builder = require('electron-builder');
const env = process.env.NODE_ENV;
const entry = `index.${env}.js`;

builder.build({
  config: {
    extraMetadata: {
      main: entry
    },
    appId: 'com.electron.foo',
    productName: 'foo',
    mac: {
      target: 'zip'
    },
    win: {
      target: 'portable'
    },
    portable: {
      artifactName: 'foo.exe'
    }
  }
});

answered Feb 5, 2020 at 8:50

Yurii Danylevych

511 silver badge2 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sravanthi Over a year ago

How do you implement this ? in package.json all we add is build .how do you overwrite package.json configuration .

Daniel Lizik · Accepted Answer · 2018-12-27 09:29:39Z

I did this with a hacky bash script

#!bin/bash

# make tmp package.json
cp package.json _package.json

# set entry file
sed -i '' "s/index.js/index.$1.js/" package.json

# set output folder
sed -i '' "s/TARGET/$1/" package.json

# package app
npm run build

# get rid of electron config package.json
rm package.json

# "reset" old package.json
mv _package.json package.json

and my package.json scripts looks like

{
  "postinstall": "electron-builder install-app-deps",
  "reinstall": "rm -rf node_modules/ && npm i",
  "start": "NODE_ENV=development electron src/index.development.js",
  "build": "build -mw",
  "build:development": "sh scripts/build.sh development",
  "build:pilot": "sh scripts/build.sh pilot",
  "build:pilot2": "sh scripts/build.sh pilot2",
  "build:production": "sh scripts/build.sh production",
  "build:all":
    "npm run build:development && npm run build:pilot && npm run build:pilot2 && npm run build:production",
  "test": "npm run postinstall && jest"
}

Collectives™ on Stack Overflow

How to build different versions with environment variables

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related