package.json
{
"main": "node_modules/expo/AppEntry.js",
"homepage": "<My URL>",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject",
"deploy": "gh-pages -d web-build",
"predeploy": "expo build:web"
},
"dependencies": {
"#react-native-community/masked-view": "0.1.6",
"#react-navigation/bottom-tabs": "^5.2.6",
"#react-navigation/drawer": "^5.8.2",
"#react-navigation/native": "^5.1.5",
"#react-navigation/stack": "^5.2.10",
"axios": "^0.19.2",
"expo": "^37.0.11",
"modal-react-native-web": "^0.2.0",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-37.0.1.tar.gz",
"react-native-actionsheet": "^2.4.2",
"react-native-dialogbox": "^0.6.10",
"react-native-elements": "^1.2.7",
"react-native-image-view": "^2.1.9",
"react-native-modal": "^11.5.6",
"react-native-reanimated": "~1.7.0",
"react-native-safe-area-context": "^0.7.3",
"react-native-screens": "~2.2.0",
"react-native-skeleton-content": "^1.0.13",
"react-native-swipeout": "^2.3.6",
"react-native-tab-view": "^2.14.0",
"react-native-vector-icons": "^6.6.0",
"react-native-web": "~0.11.7",
"react-redux": "^7.2.0",
"redux": "^4.0.5",
"redux-thunk": "^2.3.0"
},
"devDependencies": {
"#babel/core": "^7.8.6",
"#expo/webpack-config": "^0.12.11",
"babel-preset-expo": "~8.1.0"
},
"private": true
}
Make sure your package lock or yarn lock don't still include references to older versions of react-native-reanimated
for me react-native-skeleton was still referencing to an old reanimated version.
If anyone is still experiencing this problem, especially after installing react-native-skeleton, all you need to do is to run:
yarn add react-native-reanimated#1.9.0
yarn upgrade react-native-reanimated
worked for me
In my case, I have another package that has a dependency with react-native-reanimated with a specific version.
You need to update react-native-reanimated to that version.
Check this comment by jakub-gonet to Animated node with ID 2 already exists #1072:
This is most likely caused by two instances of reanimated running simultaneously.
check the package.lock file, it has two reanimated plugins, so delete the old version
and also delete the node_modules, then give yarn install or npm install and run the app
Delete the react-native-reanimated fileby
yarn remove react-native-reanimated
This solved my problem
Related
Can't fix expo problem.
My package.json:
{"name": "smth", "version": "1.0.0", "main": "node_modules/expo/AppEntry.js", "scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web" }, "dependencies": {
"#react-navigation/bottom-tabs": "^6.3.2",
"#react-navigation/native": "^6.0.11",
"#react-navigation/native-stack": "^6.7.0",
"#reduxjs/toolkit": "^1.8.4",
"expo": "~46.0.7",
"expo-app-loading": "~2.1.0",
"expo-linear-gradient": "~11.4.0",
"expo-status-bar": "~1.4.0",
"link": "^1.5.1",
"react": "18.0.0",
"react-dom": "18.0.0",
"react-native": "0.69.4",
"react-native-safe-area-context": "4.3.1",
"react-native-screens": "~3.15.0",
"react-native-svg": "12.3.0",
"react-native-svg-transformer": "^1.0.0",
"react-native-web": "~0.18.7",
"react-redux": "^8.0.2",
"tailwindcss-react-native": "^1.7.10" }, "devDependencies": {
"#babel/core": "^7.18.6",
"#types/react": "~18.0.0",
"#types/react-native": "~0.69.1",
"#types/react-redux": "^7.1.24",
"tailwindcss": "^3.1.8",
"typescript": "^4.6.3" }, "private": true}
I'm trying to launch my project, but this error keeps popping up, I can't find any information
Screenshot:
Error message
Babel config
I had the same issue. I fixed it by
removing node_modules
removing deps that were causing the issue from package.json (in my case - react-native-svg)
installing those deps NOT through npm install, but through expo install. The difference is that expo may have some compatibility issues with some libraries and expo install gets the version that it's compatible with as opposed to the latest one
hope this helps :)
cheers
I'm trying to use Ionicons on react-native app using expo, unfortunately the icon is not showing and the following error is received:
fontFamily "ionicons" is not a system font and has not been loaded through Font.loadAsync.
If you intended to use a system font, make sure you typed the name correctly and that it is supported by your device operating system.
If this is a custom font, be sure to load it with Font.loadAsync.
I'm using Iocincons in the following way:
import { Ionicons } from '#expo/vector-icons';
....
<Ionicons name="arrow-back" size={24} color="black" />
In addition, this is my package.json file:
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#expo/vector-icons": "^12.0.4",
"#react-native-community/masked-view": "^0.1.10",
"axios": "^0.21.1",
"expo": "~40.0.0",
"expo-app-loading": "^1.0.1",
"expo-font": "^9.0.0",
"expo-status-bar": "~1.0.3",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-gesture-handler": "^1.10.3",
"react-native-reanimated": "^2.0.1",
"react-native-screens": "^2.18.1",
"react-native-web": "~0.13.12",
"react-navigation": "^4.4.4",
"react-navigation-header-buttons": "^7.0.0",
"react-navigation-stack": "^2.10.4",
"react-redux": "^7.2.3",
"redux": "^4.0.5"
},
"devDependencies": {
"#babel/core": "^7.13.15"
},
"private": true
}
I've already tried to remove node_modules, package-lock.json, and run npm install, but it didn't solved the problem.
Any idea will be appreciated.
Updating expo to version 41 solved this problem.
I want to add IAP with Expo for subscriptions (monthly).
I follow this document (https://docs.expo.io/versions/latest/sdk/in-app-purchases/)
I added library with this code yarn add expo-in-app-purchases and there is no issue.
The app crashed when I write import code
import * as InAppPurchases from 'expo-in-app-purchases';
error is blowInvariant Violation: Native module cannot be null.
my package.json file:
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#react-native-community/async-storage": "^1.12.1",
"#react-native-community/masked-view": "^0.1.10",
"#react-navigation/drawer": "^5.11.4",
"#react-navigation/native": "^5.8.10",
"#react-navigation/stack": "^5.12.8",
"expo": "~40.0.0",
"expo-in-app-purchases": "^9.1.0",
"expo-status-bar": "~1.0.3",
"install": "^0.13.0",
"moment": "^2.29.1",
"npm": "^6.14.10",
"react": "16.13.1",
"react-dom": "16.13.1",
"react-native": "https://github.com/expo/react-native/archive/sdk-40.0.1.tar.gz",
"react-native-gesture-handler": "^1.9.0",
"react-native-reanimated": "^1.13.2",
"react-native-screens": "^2.16.1",
"react-native-web": "~0.13.12"
},
"devDependencies": {
"#babel/core": "~7.9.0"
},
"private": true
}
Do you have any idea for this?
Finally, Is there any demo on snack or github etc.
Thanks for updating the question. It looks to me as you are in an expo managed workflow. In order to make use of Expos IAP you would need to expo eject and configure react native unimodules.
Give some thought before ejecting and research it. However expo makes the process straight forward, however once you've ejected you cant go back.
https://docs.expo.io/expokit/eject/
Actually with eas / expo-dev-client it's possible to add IAP with managed workflow.
I published a medium guide here.
I try to use react navigation but get errors like : Package react-native-gesture-handler has been ignored because it contains invalid configuration. Reason: Cannot find module 'react-native-gesture-handler\package.json'
my json package looks like :
{
"main": "node_modules/expo/AppEntry.js",
"scripts": {
"start": "expo start",
"android": "expo start --android",
"ios": "expo start --ios",
"web": "expo start --web",
"eject": "expo eject"
},
"dependencies": {
"#react-navigation/stack": "^5.1.0",
"expo": "~36.0.0",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
"react-native-gesture-handler": "~1.5.0",
"react-native-safe-area-context": "^0.7.3",
"react-native-safe-area-view": "^1.0.0",
"react-native-web": "~0.11.7",
"react-navigation": "^4.1.1",
"react-navigation-stack": "^2.2.2"
},
"devDependencies": {
"babel-preset-expo": "~8.0.0",
"#babel/core": "^7.0.0"
},
"private": true
}
Any help would be really appreciated! Thanks
I get this eror every time install a new package. I run yarn install to resolve all dependencies again and it works.
I have been successfully using React Navigation Stack (V5) for about a week now and today my app will not build as the error - unable to resolve module is now shown.
Error Message
The module is installed as shown in my package.json file -
{
"scripts": {
"postinstall": "jetify",
"android": "react-native run-android",
"ios": "react-native run-ios",
"web": "expo start --web",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"#react-native-community/masked-view": "^0.1.6",
"expo": "~36.0.0",
"expo-linear-gradient": "^8.0.0",
"react": "~16.9.0",
"react-dom": "~16.9.0",
"react-native": "~0.61.4",
"react-native-fontawesome": "^7.0.0",
"react-native-gesture-handler": "^1.5.6",
"react-native-keyboard-aware-scroll-view": "^0.9.1",
"react-native-reanimated": "^1.7.0",
"react-native-safe-area-context": "^0.7.2",
"react-native-screens": "^2.0.0-beta.2",
"react-native-unimodules": "~0.7.0",
"react-native-web": "~0.11.7",
"react-navigation": "^4.0.10",
"react-navigation-stack": "^1.10.3"
},
"devDependencies": {
"#babel/core": "~7.6.0",
"babel-jest": "~24.9.0",
"jest": "~24.9.0",
"jetifier": "~1.6.4",
"metro-react-native-babel-preset": "~0.56.0",
"react-test-renderer": "~16.9.0"
},
"jest": {
"preset": "react-native"
},
"private": true
}
I have tried the following steps to try resolve the issue -
Deleted node_modules
Cleared yarn and npm cache
Ran npm install to install dependencies again
Cleared expo cache
Deleted and re-downoaded expo app on iOS device
Also tried installing the react navigation stack package again
Still receiving the same error message.
Would MASSIVELY appreciate any ideas.. currently losing my head over this :|
You don't have #react-navigation/stack or any #react-navigation/xxx packages in your package.json. You have react-navigation-xxx packages which are for v4.
Follow the getting started guide to set it up properly https://reactnavigation.org/docs/en/getting-started.html
Try to delete the package-lock file and run npm i