How to customize app.json to build a whitelabel app with Expo

Question

I have an application written in React Native with Expo and I need to create about 20 more apps that are almost the same but have different backend and some styling. I have an idea how to do most of that but I'm stuck when it comes to using different app.json for every build without changing it manually each time. Of course, every separate application needs to use its own name and icon. So how should I do that?

Tallu

Answer 1

Late answer incoming. Hope it is still relevant for you in some way.

As of today, in addition to the static app.json configuration file, you can write dynamic configuration in app.config.js.

So, with app.config.js you can define each white-label settings. Then, you can use environment variables to start your app with a specific white-label configuration.

For example, here's how you can have different app names per white-label.

Command to start expo: BRAND=WHITELABEL_1 expo start and BRAND=WHITELABEL_2 expo start, depending on which white-label you want to start.

app.config.js file:

const names = {
    WHITELABEL_1: 'White-label 1 Name',
    WHITELABEL_2: 'White-label 2 Name',
};

const name = names[process.env.BRAND];

export default { name };

That's how I'd approach white-labeling with Expo.

Attlee