I have an Expo managed project in which I would like to use the React Native Vision Camera. The Expo Camera does not provide enough functionalities for my app.
After following the Getting Started, I get the following errors when running the app in my web browser:
I have imported the Camera module using
import { Camera } from 'react-native-vision-camera'; and adapted my app.json to include
"plugins": [
[
"react-native-vision-camera",
{
"cameraPermissionText": "$(PRODUCT_NAME) needs access to your Camera."
}
]
]
React Native Vision Camera doesn't have web support for now.
https://github.com/mrousavy/react-native-vision-camera/discussions/892
Related
I'm using Onesignal for push notifications but am stuck in an error and could not find the solution for many days.
OneSignal SDK Configuration:
I configured the Google Android (FCM) Configuration with Firebase Server Key and Firebase Sender ID at Onesignal and selected the React Native/Expo SDK and copied the APP ID.
Expo SDK Setup:
I have Expo Managed Workflow so I run the command
expo install onesignal-expo-plugin
then I executed the command
yarn add react-native-onesignal
Added the below code into App.json
{ "plugins": [
"onesignal-expo-plugin",
{
"mode": "development",
}] }
After that import react-native-onesignal and used APP ID in useEffect into reuqired JS
import OneSignal from 'react-native-onesignal';
useEffect(() => {
OneSignal.setAppId("Pasted Copied APP ID here"); }, []);
After that Run the Command
expo prebuild
but getting error
TypeError: Cannot read property 'smallIcons' of undefinedn at withSmallIcons (\node_modules\onesignal-expo-plugin\build\onesignal\withOneSignalAndroid.js)
now getting this error on all console commands related to this react-native project.
I configured Onesignal through the below documentation
https://documentation.onesignal.com/docs/react-native-expo-sdk-setup
I solved it.
actually, the error was occurring in the below code
"plugins": [
"onesignal-expo-plugin",
{
"mode": "development"
}
]
adding the extra Square brackets [ ] solved the "Cannot read property 'smallIcons' of undefined" problem
"plugins": [
[
"onesignal-expo-plugin",
{
"mode": "development"
}
]
]
I'm making a react native app that makes a request to my server hosted on heroku.
Should I be hiding the URL of my server and if so how can I add an environment variable to a react native project?
I have made a .env file and then have done this:
console.log(process.env.URL)
Which is returning undefined - I am also using expo if that makes a difference.
If you use Expo, there is an easy way to create environment variables.
In your app.json file
{
"expo": {
"extra": {
"URL": "https://..."
}
}
}
After that, you will need to install the expo-constant package.
expo install expo-constants
And, to get the info in your app:
import Constants from "expo-constants";
console.log(Constants.manifest.extra.URL);
One library that I like to use that works for bare react native and expo is react-native-dotenv
Install it npm i react-native-dotenv
Add a .env file with your variables
MY_ENV_VARIABLE=SECRET_PASSWORD
Add the babel plugin to .babelrc file.
{
"plugins": [
["module:react-native-dotenv"]
]
}
Import and use it
import { MY_ENV_VARIABLE } from "react-native-dotenv";
function doSomething() {
console.log(MY_ENV_VARIABLE);
}
Does anyone have the same issue and able to get around?
Here is Expo doc that explains how to enable audio to be played in the background as it shown below. However, it still does not play the audio in the background when phone goes to sleep.
"expo": {
"ios": {
"infoPlist": {
"UIBackgroundModes": [
"audio"
]
}
}
}
It seems to be the issue from Expo but there's no activity on Github issue page.
I really dont know how to play background music in react native expo ..
I tried lot to add music .. since Im beginner I couldn't found
please help me
It will work on Android but will not work on iOS with expo. Need to add the following code in the app.json -
"ios": {
"supportsTablet": true,
"bundleIdentifier": "com.yourcompany.yourappname",
"buildNumber": "1.0.0",
"infoPlist": {
"UIBackgroundModes": [
"audio"
]
}
},
After that, You have to create standalone application of iOS and it will work on standalone application.
You can try this library it take mp3 from bundle or you can stream: https://github.com/react-native-kit/react-native-track-player#readme
This feature is not supported yet By Expo APIS
You can check the current state of this Expo feature request
https://expo.canny.io/feature-requests/p/audio-playback-in-background
I need to make a react native app which will be used to produce other apps using the same code (changing some logos, colors, a few features depending on the case etc)
On Android with Java I was using flavors, but with Expo to generate builds variant on Android & iOS and not having to duplicate code/projects, i'm not sure how I can do this properly. Any best practice?
Expo now supports variants, but only if you use Expo Application Services (EAS).
There is a bit too much code to include it all, but the key bit is doing this is app.config.js:
const IS_DEV = process.env.APP_VARIANT === "development";
export default {
// You can also switch out the app icon and other properties to further
// differentiate the app on your device.
name: IS_DEV ? "MyApp (Dev)" : "MyApp",
slug: "my-app",
ios: {
bundleIdentifier: IS_DEV ? "com.myapp.dev" : "com.myapp",
},
android: {
package: IS_DEV ? "com.myapp.dev" : "com.myapp",
},
};
For more info: https://docs.expo.dev/build-reference/variants/