When using an expo managed project and running the app with expo start --dev-client I get the following error:
`Invariant Violation: requireNativeComponent: "RNSScreenStackHeaderConfig" was not found in the UIManager.
This error is located at:
in RNSScreenStackHeaderConfig (created by HeaderConfig)
in HeaderConfig (created by SceneView)
in RNSScreen (created by AnimatedComponent)
in AnimatedComponent
in AnimatedComponentWrapper (created by Screen)
in MaybeFreeze (created by Screen)
in Screen (created by SceneView)
in SceneView (created by NativeStackViewInner)
in RNSScreenStack (created by ScreenStack)
in ScreenStack (created by NativeStackViewInner)
in NativeStackViewInner (created by NativeStackView)
in RNCSafeAreaProvider (created by SafeAreaProvider)
in SafeAreaProvider (created by SafeAreaInsetsContext)
in SafeAreaProviderCompat (created by NativeStackView)
in NativeStackView (created by NativeStackNavigator)
in Unknown (created by NativeStackNavigator)
in NativeStackNavigator (created by App)
in EnsureSingleNavigator
in BaseNavigationContainer
in ThemeProvider
in NavigationContainerInner (created by App)
in Provider (created by App)
in App (created by ExpoRoot)
in ExpoRoot
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:172:19 in handleException
at node_modules/react-native/Libraries/Core/ReactFiberErrorDialog.js:43:2 in showErrorDialog
at node_modules/expo-font/build/FontHooks.js:26:33 in loadAsync.then$argument_0
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function.`
When I run the project through expo go and just expo start it works perfectly.
Related
enter image description here
ERROR Invariant Violation: requireNativeComponent: "RNCSafeAreaProvider" was not found in the UIManager.
This error is located at:
in RNCSafeAreaProvider (created by SafeAreaProvider)
in SafeAreaProvider (created by SafeAreaInsetsContext)
in SafeAreaProviderCompat (created by NativeStackView)
in NativeStackView (created by NativeStackNavigator)
in PreventRemoveProvider (created by NavigationContent)
in NavigationContent
in Unknown (created by NativeStackNavigator)
in NativeStackNavigator (created by App)
in EnsureSingleNavigator
in BaseNavigationContainer
in ThemeProvider
in NavigationContainerInner (created by App)
in App
in RCTView (created by View)
in View (created by AppContainer)
in RCTView (created by View)
in View (created by AppContainer)
in AppContainer
in TechCareer(RootComponent), js engine: hermes
I added the react-navigation and then it started giving me trouble. I've checked a lot of places, but I haven't found a solution to the problem. I could use some help
NavigationContainer not working
It sounds like you either deleted or forgot to install react-native-safe-area-context. To be safe, you might as well install react-native-screens as well.
For react-native project
npm install react-native-screens react-native-safe-area-context && cd ios && npx pod install && cd ..
For expo
npx expo install react-native-screens react-native-safe-area-context
More info on setup
This is the error status
ERROR Invariant Violation: requireNativeComponent: "RNGestureHandlerRootView"was not found in the UIManager.
This error is located at:
in RNGestureHandlerRootView (at GestureHandlerRootView.android.tsx:17)
in GestureHandlerRootView (at DrawerView.tsx:317)
in RNCSafeAreaProvider (at SafeAreaContext.tsx:85)
in SafeAreaProvider (at SafeAreaProviderCompat.tsx:46)
in SafeAreaProviderCompat (at DrawerView.tsx:316)
in DrawerView (at createDrawerNavigator.tsx:126)
in Unknown (at createDrawerNavigator.tsx:125)
in DrawerNavigator (at App.js:159)
in EnsureSingleNavigator (at BaseNavigationContainer.tsx:430)
in BaseNavigationContainer (at NavigationContainer.tsx:132)
in ThemeProvider (at NavigationContainer.tsx:131)
in NavigationContainerInner (at App.js:158)
in App (at safeTransportPolice/index.js:15)
in Provider (at safeTransportPolice/index.js:14)
in Container (at renderApplication.js:50)
in RCTView (at View.js:32)
in View (at AppContainer.js:92)
in RCTView (at View.js:32)
in View (at AppContainer.js:119)
in AppContainer (at renderApplication.js:43)
in safeTransportPolice(RootComponent) (at renderApplication.js:60)
At first the code works, but after a while it crashes with this error:
The error happens in both iOS and Android, I'm using MacOS, also happens in build.
TypeError: Invalid attempt to spread non-iterable instance
This error is located at:
in Lojas (at withNavigation.js:25)
in withNavigation(Lojas) (at ShopList.js:45)
in RCTView (at Tab.js:11)
in Tab (at connectStyle.js:392)
in Styled(Tab) (at ShopList.js:30)
in StaticContainer (at SceneComponent.js:12)
in RCTView (at SceneComponent.js:11)
in SceneComponent (at Tabs/index.js:211)
in RCTScrollContentView (at ScrollView.js:1038)
in RCTScrollView (at ScrollView.js:1178)
in ScrollView (at Tabs/index.js:176)
in RCTView (at Tabs/index.js:334)
in ScrollableTabView (at ShopList.js:27)
in ShopList (at withNavigation.js:25)
in withNavigation(ShopList) (at SceneView.js:9)
in SceneView (at StackViewLayout.tsx:900)
in RCTView (at createAnimatedComponent.js:151)
in AnimatedComponent (at StackViewCard.tsx:106)
in RCTView (at createAnimatedComponent.js:151)
in AnimatedComponent (at screens.native.js:71)
in Screen (at StackViewCard.tsx:93)
in Card (at createPointerEventsContainer.tsx:95)
in Container (at StackViewLayout.tsx:975)
in RCTView (at screens.native.js:101)
in ScreenContainer (at StackViewLayout.tsx:384)
in RCTView (at createAnimatedComponent.js:151)
in AnimatedComponent (at StackViewLayout.tsx:374)
in PanGestureHandler (at StackViewLayout.tsx:367)
in StackViewLayout (at withOrientation.js:30)
in withOrientation (at StackView.tsx:104)
in RCTView (at Transitioner.tsx:267)
in Transitioner (at StackView.tsx:41)
in StackView (at createNavigator.js:80)
in Navigator (at createKeyboardAwareNavigator.js:12)
in KeyboardAwareNavigator (at createAppContainer.js:430)
in NavigationContainer (at App.js:72)
in RCTView (at react-native-drawer/index.js:579)
in RCTView (at react-native-drawer/index.js:566)
in Drawer (at Drawer/index.js:6)
in Drawer (at App.js:51)
in App (at renderApplication.js:40)
in RCTView (at AppContainer.js:101)
in RCTView (at AppContainer.js:119)
in AppContainer (at renderApplication.js:39)
_nonIterableSpread
nonIterableSpread.js:2:22
_toConsumableArray
toConsumableArray.js:8:76
fetch.then.then$argument_0
Lojas.js:39:21
renderRoot
[native code]:0
runRootCallback
[native code]:0
unstable_runWithPriority
scheduler.development.js:643:23
Component.prototype.setState
react.development.js:325:31
fetch.then.then$argument_0
Lojas.js:37:24
tryCallOne
core.js:37:14
setImmediate$argument_0
core.js:123:25
_callTimer
JSTimers.js:146:14
_callImmediatesPass
JSTimers.js:194:17
callImmediates
JSTimers.js:458:30
callImmediates
[native code]:0
flushedQueue
[native code]:0
invokeCallbackAndReturnFlushedQueue
[native code]:0
My REST API code:
getPosts = async function() {
this.setState({ loading:true })
fetch(`https://parquedasfeiras.online/wp-json/wp/v2/job_listing?filter[meta_key]=_case27_listing_type&filter[meta_value]=${this.state.typeFilter}&page=${this.state.page}`)
.then(res => res.json())
.then( res => {
this.setState(state => ({
posts: [...state.posts, ...res],
loading: false
}));
})
.catch((error) => {
this.setState(loading = false);
})
};
Note that the API is loaded normally, and only after this error is reported. I believe the error is around array concatenation, but I don't know how it can be refactored. ([...state.posts, ...res])
When sending the wrong url to that api, it will return an object of the error, not an array, which causes the problem.
e.g.
{
"code": "rest_invalid_param",
"message": "Parâmetro(s) inválido(s): page",
"data": {
"status": 400,
"params": {
"page": "page não é do tipo integer."
}
}
}
You need to check if it's an array of an object.
.then( res => {
if(Array.isArray(res)){
this.setState(state => ({
posts: [...state.posts, ...res],
loading: false
}));
} else {
console.log(res.code, res.message) // display error message
}
})
And you are probably getting an error because you are sending wrong parameters in the url.
I am working on a project with react native in expo was working fine when I was using sdk v32 , after upgrading to v34 then I got an error message saying
Invariant Violation: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined.
This error is located at:
in RCTView
in h
in RCTView
in _
in Explore
in t
in RCTView
in RCTView
in t
in RCTView
in n
in RCTView
in t
in n
in p
in t
in RCTView
in RCTView
in RCTView
in u
in RCTView
in u
in C
in t
in n
in RCTView
in n
in RCTView
in u
in PanGestureHandler
in t
in n
in RCTView
in t
in t
in p
in r
in n
in App
in RCTView
in RCTView
in n
in n
in v
in RCTView
in RCTView
in c
This error is located at:
in n
in App
in RCTView
in RCTView
in n
in n
in v
in RCTView
in RCTView
in c
Android
iOS
Web
For me the problem was Expo have moved modules out of expo namespace.
import { AdMobBanner} from 'expo';
changed to
import { AdMobBanner} from 'expo-ads-admob';
and run
expo install expo-ads-admob
[17:28:29] Invariant Violation: Could not find "store" in the context of
"Connect(AppNavigator)". Either wrap the root component in a`<Provider>`
or pass a custom React context provider to <Provider> and the corresponding
React context consumer to Connect(AppNavigator) in connect options.
This error is located at:
in Connect(AppNavigator) (at App.js:17)
in RCTView (at View.js:44)
in ActionSheet (at ActionSheetProvider.js:56)
in ActionSheetProvider (at App.js:16)
in ApolloProvider (at App.js:15)
in App (at withExpoRoot.js:22)
in RootErrorBoundary (at withExpoRoot.js:21)
in ExpoRootComponent (at renderApplication.js:34)
in RCTView (at View.js:44)
in RCTView (at View.js:44)
in AppContainer (at renderApplication.js:33)