I have 3 environments development, testing, production in my React Native app
Android is managed by flavours + buildTypes
iOS is managed by different schema + configurations
I have a library that serves only testing purposes (sending info about testing sessions like device ids, user names, video recording etc.)
I don't use this in production at all, it should be only an internal thing
I manage that now by if-else + .env, but...
I don't want that (potentially risky if misconfigured) library to be in the production build at all. I want to completely exclude it.
How do you manage that for Android and iOS builds? Any tips and tricks are welcome.
I tried to add react-native.config.js as described in documentation react-native-community dependencies, but then the error Library not found was raised.
module.exports = {
'my-library-name': {
platforms: {
ios: {
configurations: ['testing'],
},
android: {
buildTypes: ['testingRelease'],
},
},
},
}
Related
I'm not a dev, and I'm kind of desperate.
I'm having an app built on symphony/react-native. And now we are implementing the stripe payment on the app, my devs seem kind of cornered.
The reason I chose react native is to have one codebase for my mobile and web app.
I'm trying to use stripe to process the payment on my app, but it seems that stripe-react-native doesn't run on web platform.
Does anyone think of a way to make stripe work on web without having to build a separate react app ?
I was thinking about using a platform condition to either run stripe from the react native module or from the stripe.js script, but I'm told that it's not possible.
If someone has any idea we could try, it would be very helpful.
Thanks
If you are using react-native-web, you can override incompatible Node modules in various ways.
One method of launching/building RN Web is to use react-app-rewired, and inside config-overrides.js you can declare a path to your own version of react-native-stripe.
You would need to implement this yourself, write an equivalent implementation for each method, and somehow load the web SDK for Stripe.
It's very doable if you are experienced and a similar process to mocking modules in Jest.
Here is an example:
// config-overrides.js used by react-app-rewired
const webpack = require('webpack');
const path = require('path');
module.exports = {
webpack: function (config, env) {
config.resolve.alias['#stripe/stripe-react-native'] = path.resolve(
'web/react-native-stripe',
);
},
};
(simplified version of the example here https://github.com/webpack/webpack/issues/4039#issuecomment-686158264)
However, if you are not forced to adapt an existing codebase to also support react-native-web, I would strongly recommend starting a new project using Expo which will support Web, iOS and Android right from the beginning. It is now possible to write polyfill modules for incompatible libraries within Expo.
Unfortunately, it's the case. You would need a separate web codebase and a separate mobile codebase. ReactNative is mobile, and for web, you have various choices, like regular web development.
You can choose ReactNative for mobile and ReactJS for web, though, and they will be similar on some level. But they are still different platforms.
I am doing the changes in my local machine in react native expo app. but after the build, the changes are reflecting in the app I downloaded from the google play without update the app on google play. I don't why this is happening. is it expo natural behaver or I did something, that I don't remember.
Expo, by default, supports Over the Air (OTA) updates which pushes a new JS bundle to live apps when you publish.
You can disable this by changing your app.json to include:
{
"updates": {
"enabled": false
}
}
For more information on configuring OTA updates see the Expo Documentation
I am in need of advice of how to deal with something:
I have an app that will soon be published to App Store and Google Play, I would like to find a way to have a clone of this app with less features, this clone is meant to give a taste of the app for users and also for the salesman of the company to demonstrate it, also I would like to keep both apps installed in the same device, so in the case of the salesman, they could demonstrate with this "demo app" and also use the real app for their own purposes.
I know that I could just have a beta user group on TestFlight and Google Play but that would need me to register those users or give them a link to register as beta and would not be possible to have both apps installed.
I want to make this "demonstration app" to be downloadable from the stores, it would have different API calls from the real app, different icon, etc...
but I would like to avoid having to maintain and copying every change from the "production" app to the "demo" app.
The option I thought: create a branch and rename the app to the new signature, name, icons and so I will just have to always pull the diff from the origin/master branch and publish it on the stores, but it didn't worked, since xcode breaks the app and give me random errors when I do it.
I would appreciate to receive ideas and workarounds for this.
I can currently have four different versions of an app I developed installed. The solution for this really depends on your setup, but here is currently how I do it1. It is not the only way but it works for me and I find the issues that this setup causes so small that it doesn't really bother me.
iOS
The simplest solution for iOS is to have different Bundle Identifiers. This requires you to have different provisioning profiles. One provisioning profile for each development environment (if you want to put them on device for testing away from the development machine they need to be distribution profiles) and one profile for submission to the App Store.
Xcode has the ability to manage different environments with different provisioning profiles, however this caused me major issues when using CocoaPods and I ended up having to stop Xcode from managing it.
What I do now is I add a script to my workflow2 that forces the correct Bundle Identifier for the environment. If I want to build locally, I just manually change the Bundle Identifier and the provisioning profile (it only takes a second)
Android
For Android I use the built in flavors to manage the different environments. It is really easy to set up. in my app/build.gradle I added the following:
flavorDimensions "version"
productFlavors {
dev {
dimension "version"
applicationIdSuffix ".dev"
}
uat {
dimension "version"
applicationIdSuffix ".uat"
}
staging {
dimension "version"
applicationIdSuffix ".staging"
}
prod {
dimension "version"
applicationIdSuffix ".prod"
}
}
This adds a applicationIdSuffix to your builds which means that you can install multiple types on to your device. Using flavors is a really powerful way to manage your android applications. You can read more about using flavors here
One important point to note is that using flavors does change how you have to run your application.
Instead of using react-native run-android I now have to use react-native run-android --variant=devDebug.
When I want to build it instead of using ./gradlew assembleRelease, I have to use ./gradlew assembledevRelease (you have to change this for each flavor that you use)
There is also a small bug with react-native that when using the --variant flag it doesn't launch the app, so you just have to click on the icon on the device. But if you launch it from Android Studio it launches just fine.
So if you launch your application from Android Studio, or add the appropriate scripts to your package.json these issues melt away.
1 I don't use Expo for my production applications, only for prototyping, so these solutions are for full react-native applications with access to native code.
2 I use Bitrise to build my apps so it is easy to add bash scripts or similar to the build process.
If you want them to download the apps from stores then apps have to have different package/applicationIDs.
I've worked on a react native project recently and we actually handled staging and production apps in single branch. Although we didn't release staging app on play store, we were sharing using Google drive and since both app had different packages, it was possible to install both of them together.
To change the applicationId, you need to make changes in app's build.gradle file in Android. Simply add .demo or .anything at the end of your production applicationId. And also change your api end point and App name and icons if you'd like. So this becomes cumbersome doing manually after sometime because you have to change back and forth. So we wrote a shell script to make all these changes before building the apk.
We actually didn't need to install 2 versions on iPhone, so we didn't do anything about it. Also I'm not familiar with iOS development but I guess process will be somewhat similar.
Now we don't have to keep track of changes from one branch to another. Setup(Shell scripts) will take some but it will be worth it.
I want to know if there is a way to use Expo SDK without publishing on their servers. To be honest, i want to use my own OTA server with Electrode and a react native app, but, Expo has many helpful native resources (fb ads, SecureStore, admob, push notitications, FileSystem, Asset, Payments and many many more...).
I have read and apparently it is imposible (i guess) use Expo SDK Api without using Exp online services even detaching or ejecting (CRNA) the app.
I apreciate your help
You need to add the follow properties to app.json
"updates": { enabled: false }:
If set to false, your standalone app will never download any code, and will only use code bundled locally on the device.
"assetBundlePatterns": [<insert paths>] (if you use any local assets):
An array of file glob strings which point to assets that will be bundled within your standalone app binary.
If you need to detach (to add other native modules), you need to be on Expo SDK v27:
ExpoKit projects on iOS and Android which were created with exp detach now support bundling your assets inside your native app archive so that your app can launch with no internet.
The Expo team is also planning to add the following features:
modularise the SDK to allow non-Expo projects to use the sdk
allow JS bundle and assets to be self-hosted.
Is there a way to determine if the current running react-native app was a debug build? Specifically for android, but hopefully platform agnostic.
Use DEV flag
if (__DEV__) {
console.log('I am in debug');
}