Tried to register two views with the same name RNCWebView - react-native

I have used two social login and both are refers the react-native-webview dependency.
installed versions:
react-native-linkedin(it uses react-native-webview 7.0.5),
react-native-instagram-login (it uses react-native-webview 7.5.1),
react-native-webview ^7.5.1
Can you please tell me how to resolve this issue
screenshot
https://i.stack.imgur.com/ETW5J.png

facing same issue with same library . It is cause of different versions of webview which these library are using and as much as i know we can update those npm module directly so we can solve this issue temporary by following these steps
Create file InstaWebView.js(name can be any)
Copy code from
https://github.com/hungdev/react-native-instagram-login/blob/master/Instagram.js
Paste in InstaWebView.js and use as normal
I know it is hack but for now we can do this
Note :- For this hack , you need to install webview module so you may install webview module of same version as linkedin has so there will be no issue

Related

How to Upgrade React Native Version 0.66.3 to 0.70.6?

Currently, my project running on the 0.66.3 version I need to upgrade to react native version 0.70.6. So I have used to following command
npx react-native upgrade
After running this command showing some error I have attached a screenshot please refer.
I am also trying the manual way using react native helper but some files are not available in my project.
so anyone please tell me how I will upgrade my project version?
After Run npx react-native run-android my build was created successfully but 3 errors showing in the metro bundler. I have attached a screenshot of the metro bundler error.
you can specify a React Native version and pass it as an argument:
npx react-native upgrade 0.70.6
you can also refer this official documentation for this
& it will also helps you if you got any error.
https://reactnative.dev/docs/upgrading
I found by changing react-native - index.js and react-native/Libraries/Text - index.js
Follow this link for output:
https://github.com/facebook/react-native/commit/3f629049ba9773793978cf9093c7a71af15e3e8d
Don't know whether it is the right way or not....
Since upgrading an application can break functionality in your app if you do not know what is needed to be changed. the upgrade is tells you to visit the pages to go through and see what has changed throughout the upgrading process.
Other as that I am just needing more information regarding to what is not working. Since upgrading is more as just running a command, its about reading the documentation and see what part is missing and what they replaced the files with. The missing files could be straight-out deprecated and not working with the new version.
As always check the debugger and read every message throughout and visit all links given and see the documentation regarding the upgrade differences, find out if there are any log files you could look at, and talk with people in your company / group of react-native about this.
"Some files are not available in my project"
This part might just be able to google and see if this is still supported or not in the version it could be phased out, or not supported in the version. that's where versioning comes in to play.
I am unsure what files and which libraries are deprecated based on your Opening Post, this needs more information, to help us, help you.

React-Native, React-Native-Web and React-Navigation/Stack

Has anyone been able to get React-Native 0.7, React-Native-Web and React-Navigation/Stack 6.2.3 to work on web? I have a small app working on iOS and Android which I am trying to enable on web too. iOS and Android portion work fine and using metro.
However, webpack build continues to error out with "Module parse failed: Unexpected token" on the NavigationContainer.
I tried searching both react-native-web and react-navigation Issues on their respective GitHub Repositories. However, could not find something to solve my issue. Also tried modifying webpack.config with several different configurations/loaders.
Used links below as a reference too:
https://arry.medium.com/how-to-add-react-native-web-to-an-existing-react-native-project-eb98c952c12f
https://gist.github.com/skabbes/0bfa0a969aac8ec13f716dda1ad2ab43
Yes, it happens that I maintain a library that does just that: creates a bare React Native app that also runs on the web: 🌒 Luna - https://github.com/criszz77/luna
Here is the live example: https://criszz77.github.io/luna/
You can find more on the wiki page about how it's implemented and you can also implement it by yourself: https://github.com/criszz77/luna/wiki
By using react-scripts, you don't have to handle webpack, babel and other hard configs by yourself.
It currently doesn't run on 0.7 (didn't have time to make the update), but it's in plan to support all the latest versions of course ASAP.
EDIT: Updated to 0.70.3 🎉

How to add a simple recaptcha in React Native Application?

I make a Phone Authentication page using React-Native and thought that to store the data in firebase so, security purpose I will add a reCaptcha that who fill the reCaptcha they can click the the verify button otherwise no. But when I install this package: npm install react-native-google-recaptcha-v2, I got some error. How can I add reCaptcha ?enter image description here
You have used
npm install react-native-google-recaptcha-v2,
so instead of that If you have yarn installed then you can try this
yarn add react-native-google-recaptcha-v2.
Basically, this library is very old so there are version conflicts while using yarn that will manage all things.
react-native-google-recaptcha-v2is a very old library so you can try https://www.npmjs.com/package/react-native-recaptcha-that-works, maybe this will work for you.
You need to create a project with react version 16.9 and then it works with react-native-google-recaptcha-v2.
react-native-google-recaptcha-v2 lib is too old and not maintained with new React version. You can use latest one react-native-recaptcha-that-works.
You can use the latest library
react-native-recaptcha-that-works

'NativeReanimated' could not be found. Verify that a module by this name is registered in the native binary

This is my Code which is showing this error . Here I am trying to make a Drawer-navigation
This is the error showing , I am doing this in react-native.
It seems you might have missed some installation / setup steps for react-navigation.
Please check this section in the docs: https://reactnavigation.org/docs/getting-started#installing-dependencies-into-a-bare-react-native-project
If you have already installed the packages listed there (notably react-native-reanimated), perhaps you have not installed the native dependencies. This is important on iOS - run npx pod-install in your project root, and then build the app again (hot reload will not be enough).

Get Device details in React-native App

I have to fetch device details like Unique Id, Device manufacturer, OS type and OS version, user Locale from android and IOS devices/Simulators.
I have implemented by following this approach. I'm using React-native 0.49
In Project folder
npm install --save react-native-device-info
In JS file at imports section
var DeviceInfo= require('react-native-device-info');
then accessing by alert
alert(DeviceInfo.getUniqueID());
Its throwing 'UNDEFINED IS NOT AN FUNCTION EVALUATING".
I have followed this GITHUB LINK
Let me know where its going wrong.
Is there any other library to achieve this.
Hi i am using this same library for past 8 months.. this error maybe occurs some other function definitions. so please check your function definitions and then your approach is exactly correct there is no errors in DeviceInfo. But you should link react-native link react-native-device-info before you use this library.