Can someone guide me on this issue which shows up once I try using expo in my react native project.
Dependencies:
"expo": "^21.0.2",
"react": "^16.0.0-alpha.12",
"react-native": "^0.48.4",
"react-native-animatable": "^1.2.4",
"react-native-snap-carousel": "^3.3.2",
"react-native-swiper": "^1.5.13",
"react-navigation": "^1.0.0-beta.13"
Error Message
If I use create-react-native-app to initiate my project, I don't see the issue that you mentioned. But if I use react-native init to create my project, I see the same issue. To fully take advantage of the integration of react native and expo client, do the following:
npm install -g create-react-native-app
create-react-native-app YourProjectName
cd YourProjectName
npm start
Hope that helps.
Related
I've created a fresh new React Native MacOS app and added in react-navigation. I am using React-Native 0.64 as the MacOS guide notes that it is the latest compatible version of React Native for react-native-macos.
I have the following dependencies installed via npm
"dependencies": {
"#react-native-community/masked-view": "^0.1.11",
"#react-navigation/native": "^6.0.12",
"#react-navigation/native-stack": "^6.8.0",
"react": "17.0.1",
"react-native": "0.64.3",
"react-native-gesture-handler": "^2.6.0",
"react-native-macos": "^0.64.30",
"react-native-reanimated": "^2.10.0",
"react-native-safe-area-context": "^4.3.3",
"react-native-screens": "^3.17.0",
"react-navigation-stack": "^2.10.4"
},
When I try to install the react-navigation packages and follow up with the pod-install command we see the following:
$ pod --version
1.11.3
$ pod install
Auto-linking React Native modules for target `slidesmacos-iOS`: RNCMaskedView, RNGestureHandler, RNReanimated, RNScreens, and react-native-safe-area-context
Analyzing dependencies
[!] CocoaPods could not find compatible versions for pod "react-native-safe-area-context":
In Podfile:
react-native-safe-area-context (from `../node_modules/react-native-safe-area-context`)
Is react-navigation available for react-native-macos?
It seems that you didn't install or the CocoaPods can't find a valid local installation for that lib (react-native-safe-area-context).
You can search what libs can be used for each platform at this website (with the flag ?macos=true) and the react-navigation is one of the recommended ones.
About your problem, did you follow up on all the steps from the install guide? It was mentioned about dependencies for Expo managed and Bare projects. The idea of it is that you need to install 2 more dependencies and one of them is what is missing:
react-native-screens
react-native-safe-area-context
There is also this answer to a similar question where the steps to fix are just some updates. One comment to that answer also stated that it was necessary to run pod repo update or pod install --repo-update. This could also help you.
I have updated React Native from v0.61.4 to v0.62.2 to try and use Flipper.
When I build and run the app The Metro Bundler throws the warning:
The native module for Flipper seems unavailable. Please verify that react-native-flipper is installed as yarn dependency to your project and, for iOS, that pod install is run in the ios directory.
I have installed it using npm.
My package.json looks like this:
"dependencies": {
"react": "16.13.1",
"react-native": "0.62.2",
"react-native-flipper": "^0.45.0",
"react-redux": "^7.1.3",
"redux": "^4.0.4",
"redux-flipper": "^1.2.0",
"redux-thunk": "^2.3.0",
...
In Flipper, React DevTools can connect to the app but when I try to use the Hermes Debugger or plugins they cannot be used:
When I run this:
adb shell am start -n com.app/com.facebook.flipper.android.diagnostics.FlipperDiagnosticActivity
I get this error:
Error type 3
Error: Activity class {com.app/com.facebook.flipper.android.diagnostics.FlipperDiagnosticActivity} does not exist.
What could be the reason for the modules not installing correctly?
This is my package.json:
{
"name": "BStore",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"expo": "^32.0.5",
"native-base": "^2.11.0",
"prop-types": "^15.7.2",
"react": "16.6.3",
"react-native": "0.58.3",
"react-native-gesture-handler": "^1.0.15",
"react-native-paper": "^2.11.0",
"react-navigation": "^3.0.9",
"react-navigation-material-bottom-tabs": "^1.0.0"
},
"devDependencies": {
"babel-core": "7.0.0-bridge.0",
"babel-jest": "24.1.0",
"jest": "24.1.0",
"metro-react-native-babel-preset": "0.51.1",
"react-test-renderer": "16.6.3"
},
"jest": {
"preset": "react-native"
}
}
I am getting this error Unable to resolve modulereact-native/Libraries/Components/View/ViewStylePropTypes`
any ideas how can I solve this issue?
Had same issue.
As I find out expo 32.0.5 and react-native 0.58.3 are not compatible. So expo react-native fork should be used.
To install it you can use command
npm install --save react-native#https://github.com/expo/react-native/archive/sdk-32.0.1.tar.gz
You have to read the error-message carefully. I've the same issue, mine was:
Unable to resolve module
react-native/Libraries/Components/View/ViewStylePropTypes from
/APP/node_modules/react-native-render-html/src/HTMLUtils.js:
Module react-native/Libraries/Components/View/ViewStylePropTypes
does not exist in the Haste module map
So the 3rd Party Library react-native-render-html cause the error, because it try to use ViewStylePropTypes.
In case of #adrian-moisa: For you it's react-native-reanimated.
Don't know what the cause was for the ThreadOpener, he didn't post an usable error-message.
Fact is, that ViewStylePropTypes was removed up from react-native 0.58
compare:
https://github.com/facebook/react-native/tree/v0.57.8/Libraries/Components/View
https://github.com/facebook/react-native/tree/v0.58.0/Libraries/Components/View
So the solution is to figure out, which 3rd-Party Component cause the error, and look if there is an upgrade from the maintainer, or yourself have to patch it (e.g. with patch-package)
This combo works for me:
"expo": "^31.0.4",
"react": "16.5.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-31.0.1.tar.gz",
I adjusted the instructions from here, with what worked for me:
Here’s how to upgrade your app to Expo SDK 32.0.6 from 31.0.0:
Close your Expo CLI server In app.json, change sdkVersion to "32.0.1"
In package.json, change these dependencies:
react-native to "https://github.com/expo/react-native/archive/sdk-32.0.1.tar.gz"
expo to "^32.0.6"
react to "16.8.6" — (this exact version)
react-navigation to "^3.9.1" (if you use it — this is also optional, you don’t have to update it to use the newest SDK. If you
choose to, make sure you read the changelog for breaking changes, and
see this upgrade guide for upgrading from v2 to v3.)
jest-expo to "^32.0.0" (if you use it)
sentry-expo to "~1.11.2" (if you use it) Delete your project’s node_modules directory and run npm install again (or use Yarn, we
love Yarn) Run expo start -c Update the Expo app on your phones from
the App Store / Google Play. expo-cli will automatically update your
apps in simulators. Make sure to check the breaking changes section
of this post! If you built a standalone app previously, remember that
you will need to create a new build in order to update the SDK
version. Run expo build:iosand/or expo build:android when you are
ready to do a new build for submission to stores. If you are planning
to submit your iOS app to the App Store, you must upgrade to Xcode 10
in order to do so.
I downloaded a react-native application from a git repository. Inside it, there is a file called package.json that looks like this:
"dependencies": {
"expo": "^27.0.0",
"invariant": "^2.2.4",
"react": "16.3.1",
"react-native": "^0.55.0",
"react-native-iphone-x-helper": "^1.0.2",
"react-navigation": "link:../..",
"react-navigation-header-buttons": "^0.0.4",
"react-navigation-material-bottom-tabs": "0.1.3",
"react-navigation-tabs": "^0.5.1"
}
Do I need to use npm to install all these libraries or will the app download them automatically?
Thanks!
Yes, you need to npm install in the terminal, from the project root directory, to download and install the dependencies, as #gaback suggested in a comment.
Alternatively, if you prefer using yarn, you can yarn install from the same directory to install the dependencies.
I'm using expo with react native. All is fine, but i get this warning and the app takes a long time in loading :
[exp] Warning: Not using the Expo fork of react-native. See https://docs.expo.io/.
How can i fix it please.
If you create a react native app with the command from the getting started page: $create-react-native-app AwesomeProject then the package.json file has the following dependencies:
"dependencies": {
"expo": "^20.0.0",
"react": "16.0.0-alpha.12",
"react-native": "^0.47.0"
}
If you create an app directly in the Expo XDE, you will see in the package.json, they use a fork of react-native:
"dependencies": {
"expo": "^20.0.0",
"react": "16.0.0-alpha.12",
"react-native": "https://github.com/expo/react-native/archive/sdk-20.0.0.tar.gz"
},
Changing the react-native module path to https://github.com/expo/react-native/archive/sdk-20.0.0.tar.gz and running npm install will fix the problem.
That's how I fixed it:
I updated my "react-native" dependency to the latest one available:
"https://github.com/expo/react-native/archive/sdk-23.0.0.tar.gz"
I removed all dependency that I had installed by mistake in my previous expo app that actually required react-native link using the npm uninstall --save command:
react-native-image-to-base64,
react-native-cloudinary
Then I also had to remove them from the General > Linked Frameworks and Libraries
Now it works! I'm having issues with the Facebook Login now but at least it doesn't crash my app.
Good luck to you.