`expo start --dev-client`: Invariant Violation: requireNativeComponent: "RNSVGRect" was not found in the UIManager

[thiskevinwang]

When running with

• expo start — ✅ The basic sample LineChart renders fine
• expo start --dev-client ❌ — The app crashes with ~42 errors like

  • Invariant Violation: requireNativeComponent: "RNSVGRect" was not found in the UIManager

    "expo": "~45.0.0",
    "react-native-chart-kit": "^6.12.0",

Note: I tried following the steps in these other issues, with no success

• https://github.com/react-native-svg/react-native-svg/issues/749
• https://github.com/react-native-svg/react-native-svg/issues/834

[thiskevinwang]

Some additional logs

Invariant Violation: requireNativeComponent: "RNSVGRect" was not found in the UIManager.

This error is located at:
    in RNSVGRect (created by Rect)
    in Rect (created by LineChart)
    in RNSVGGroup (created by G)
    in G (created by Svg)
    in RNSVGSvgView (created by Svg)
    in Svg (created by LineChart)
    in RCTView (created by View)
    in View (created by LineChart)
    in LineChart (created by TabOneScreen)
    in RCTScrollContentView (created by ScrollView)
    in RCTScrollView (created by ScrollView)
    in ScrollView (created by ScrollView)
    in ScrollView
    in Unknown (created by AnimatedComponent)
    in AnimatedComponent
    in AnimatedComponentWrapper (created by TabOneScreen)
    in RCTSafeAreaView
    in SafeAreaView (created by TabOneScreen)
    in TabOneScreen (created by SceneView)
    in StaticContainer
    in EnsureSingleNavigator (created by SceneView)
    in SceneView (created by BottomTabView)
    in RCTView (created by View)
    in View (created by Screen)
    in RCTView (created by View)
    in View (created by Background)
    in Background (created by Screen)
    in Screen (created by BottomTabView)
    in RNSScreen (created by AnimatedComponent)
    in AnimatedComponent
    in AnimatedComponentWrapper (created by Screen)
    in MaybeFreeze (created by Screen)
    in Screen (created by MaybeScreen)
    in MaybeScreen (created by BottomTabView)
    in RNSScreenNavigationContainer (created by ScreenContainer)
    in ScreenContainer (created by MaybeScreenContainer)
    in MaybeScreenContainer (created by BottomTabView)
    in RCTView (created by View)
    in View (created by SafeAreaInsetsContext)
    in SafeAreaProviderCompat (created by BottomTabView)
    in BottomTabView (created by BottomTabNavigator)
    in Unknown (created by BottomTabNavigator)
    in BottomTabNavigator (created by BottomTabNavigator)
    in BottomTabNavigator (created by SceneView)
    in StaticContainer
    in EnsureSingleNavigator (created by SceneView)
    in SceneView (created by SceneView)
    in RCTView (created by View)
    in View (created by DebugContainer)
    in DebugContainer (created by MaybeNestedStack)
    in MaybeNestedStack (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 RCTView (created by View)
    in View (created by SafeAreaInsetsContext)
    in SafeAreaProviderCompat (created by NativeStackView)
    in NativeStackView (created by NativeStackNavigator)
    in Unknown (created by NativeStackNavigator)
    in NativeStackNavigator (created by RootNavigator)
    in RootNavigator (created by Navigation)
    in EnsureSingleNavigator
    in BaseNavigationContainer
    in ThemeProvider
    in NavigationContainerInner (created by Navigation)
    in Navigation (created by App)
    in TailwindProvider (created by App)
    in RNCSafeAreaProvider (created by SafeAreaProvider)
    in SafeAreaProvider (created by App)
    in RCTView (created by View)
    in View (at ActionSheet/index.ios.tsx:16)
    in ActionSheet (at ActionSheetProvider.tsx:35)
    in ActionSheetProvider (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
    in main(RootComponent)
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:4 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException
at node_modules/react-native/Libraries/Core/ReactFiberErrorDialog.js:52:4 in showErrorDialog
at node_modules/@react-navigation/native/src/useThenable.tsx:26:18 in resolve

[Unhandled promise rejection: Invariant Violation: requireNativeComponent: "RNSVGRect" was not found in the UIManager.]
at node_modules/react-native/Libraries/ReactNative/getNativeComponentAttributes.js:28:11 in getNativeComponentAttributes
at node_modules/react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry.js:116:25 in exports.get
at node_modules/@react-navigation/native/src/useThenable.tsx:26:18 in resolve

[thiskevinwang]

Maybe safe to close, with action item to update the README

I eventually got around this by publishing a new dev-client build

• eas build --profile development --platform ios

Would be nice to have some docs for this gotcha!

[Brice31]

I have the same problem as you. I have published a new dev-client build but I still have the error. Did you do something else?

`Invariant Violation: requireNativeComponent: "RNSVGPath" was not found in the UIManager.

This error is located at: in RNSVGPath (created by Path) in Path (created by PieChart) in RNSVGGroup (created by G) in G (created by PieChart) in RNSVGGroup (created by G) in G (created by PieChart) in RNSVGGroup (created by G) in G (created by Svg) in RNSVGSvgView (created by Svg) in Svg (created by PieChart) in RCTView (created by View) in View (created by PieChart) in PieChart (created by InvoiceReportScreen) in RCTView (created by View) in View (created by InvoiceReportScreen) in RCTView (created by View) in View (created by ScrollView) in RCTScrollView (created by ScrollView) in ScrollView (created by ScrollView) in ScrollView (created by InvoiceReportScreen) in RCTView (created by View) in View in SafeAreaView (created by InvoiceReportScreen) in InvoiceReportScreen (created by SceneView) in StaticContainer in EnsureSingleNavigator (created by SceneView) in SceneView (created by SceneView) in RCTView (created by View) in View (created by DebugContainer) in DebugContainer (created by MaybeNestedStack) in MaybeNestedStack (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 RCTView (created by View) in View (created by SafeAreaInsetsContext) in SafeAreaProviderCompat (created by NativeStackView) in NativeStackView (created by NativeStackNavigator) in Unknown (created by NativeStackNavigator) in NativeStackNavigator (created by InvoiceNavigation) in InvoiceNavigation (created by SceneView) in StaticContainer in EnsureSingleNavigator (created by SceneView) in SceneView (created by BottomTabView) in RCTView (created by View) in View (created by Screen) in RCTView (created by View) in View (created by Background) in Background (created by Screen) in Screen (created by BottomTabView) in RNSScreen (created by AnimatedComponent) in AnimatedComponent in AnimatedComponentWrapper (created by Screen) in MaybeFreeze (created by Screen) in Screen (created by MaybeScreen) in MaybeScreen (created by BottomTabView) in RNSScreenContainer (created by ScreenContainer) in ScreenContainer (created by MaybeScreenContainer) in MaybeScreenContainer (created by BottomTabView) in RNCSafeAreaProvider (created by SafeAreaProvider) in SafeAreaProvider (created by SafeAreaInsetsContext) in SafeAreaProviderCompat (created by BottomTabView) in BottomTabView (created by BottomTabNavigator) in Unknown (created by BottomTabNavigator) in BottomTabNavigator (created by TabNavigation) in TabNavigation (created by Navigation) in EnsureSingleNavigator in BaseNavigationContainer in ThemeProvider in NavigationContainerInner (created by Navigation) in Navigation (created by App) in PortalProvider (created by BottomSheetModalProviderWrapper) in BottomSheetModalProviderWrapper (created by App) in ThemeProvider (created by Provider) in RCTView (created by View) in View (created by Portal.Host) in Portal.Host (created by Provider) in Provider (created by App) in Provider (created by App) in AuthProvider (created by App) in SearchProvider (created by App) in ModalProvider (created by App) in QueryClientProvider (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 in main(RootComponent) at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:4 in reportException at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException at node_modules/react-native/Libraries/Core/ReactFiberErrorDialog.js:52:4 in showErrorDialog`

[shamsKhokhar56]

Maybe you have forgot to install 'react-native-svg' as mentioned in the document.

[jyan212]

You can try uninstall your app from the emulator/device and try rebuild it again.

[lucksp]

I am seeing the same error. We have a library that uses react-native-svg as a dependency. It's already installed as part of it. When we develop locally, there are no issues. When we build on EAS, the app crashes immediately. I added an ErrorBoundary and added the expo-dev-client package so we can debug locally from a compiled EAS build.

Local error logging:

ERROR getDerivedStateFromError [Invariant Violation: requireNativeComponent: "RNSVGPath" was not found in the UIManager.]

Error stack:

 ERROR  Invariant Violation: requireNativeComponent: "RNSVGPath" was not found in the UIManager.

This error is located at:
    in RNSVGPath (created by Path)
    in Path (created by LogoIcon) <==== this is the SVG icon path being rendered
    in RNSVGGroup (created by G)
    in G (created by Svg)
    in RNSVGSvgView (created by Svg)
    in Svg (created by Icon)
    in RCTView (created by View)
    in View (created by Icon)
    in Icon (created by LogoIcon) <==== this is the SVG icon being rendered
    in FluidLogoIcon (created by NavigationContainer)
    in EnsureSingleNavigator
    in BaseNavigationContainer
    in ThemeProvider
    in NavigationContainerInner (created by NavigationContainer)
    in NavigationContainer (created by App)
    in RNCSafeAreaProvider (created by SafeAreaProvider)
    in SafeAreaProvider (created by App)
    in SWRConfig$1 (created by SWRConfigWrapper)
    in SWRConfigWrapper (created by App)
    in ErrorBoundary (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
    in main(RootComponent)

You can see it's trying to render the Splash Screen, which has the item above LogoIcon which comes from our library.

When I run yarn list to view deps, it looks like react-native-svg is correctly installed which came from the library, not installed as an actual dependency in our project:

[email protected]
│  ├─ css-select@^4.2.1
│  └─ css-tree@^1.0.0-alpha.39

For what it's worth, we tried adding react-native-svg as a dep to the project and it makes no difference.

[thiskevinwang]

@lucksp are you running eas build --profile development --platform ios?

Did you try running expo prebuild --yarn before? (should update your ios & android dirs)

FWIW: my ./ios/Podfile.lock has several references to RNSVG

  - RNSVG (12.3.0):
    - React-Core
...
  - RNSVG (from `../node_modules/react-native-svg`)
...
  RNSVG:
    :path: "../node_modules/react-native-svg"
...
  RNSVG: 302bfc9905bd8122f08966dc2ce2d07b7b52b9f8

[lucksp]

thanks for quick reply @thiskevinwang

Did you try running expo prebuild --yarn before? (should update your ios & android dirs)

no, i will try that.

@lucksp are you running eas build --profile development --platform ios?

yes, i am running eas build --profile development --platform ios

FWIW: my ./ios/Podfile.lock has several references to RNSVG

I guess I will find out when I prebuild

EDIT:

I read through the docs and am not entirely sure why I need to prebuild...

[jonnycraze]

I'm running into this same issue building for Android. It works fine when running with expo start, but not with the dev client. I'm continuing to hunt down how to resolve the issue.

[melissa07]

I have the same error on Android only, I'm using expo. Here are my versions of react-native-svg and react-native-svg-charts: "react-native-svg": "^13.4.0", "react-native-svg-charts": "^5.4.0",

Has anybody found a solution ?

[GaWr26]

Same issue for me building for Android. Anybody able to resolve this?

[rhenry7]

Has anyone found a solution? Same issue for IOS.

[GITupeer]

the same problem on iOS and Android

[Hambob]

the same problem on Andoid

[Hambob]

I have the same error on Android only, I'm using expo. Here are my versions of react-native-svg and react-native-svg-charts: "react-native-svg": "^13.4.0", "react-native-svg-charts": "^5.4.0",

Has anybody found a solution ?

did u find a way to solve it??!

[thiskevinwang]

It's been a long time since I've touched this, but has everyone/anyone tried the following commands?

• prebuild
• then build dev client
• install the dev client
• run local development

expo prebuild --yarn
eas build --profile development --platform ios

[KrithikShailesh]

I am facing the same issue building for android, Did anyone find a solution?

[bewallyt]

@thiskevinwang - the steps you gave in

https://github.com/indiespirit/react-native-chart-kit/issues/614#issuecomment-1419656489

worked for me

[thiskevinwang]

Closing this as the steps in https://github.com/indiespirit/react-native-chart-kit/issues/614#issuecomment-1419656489 were confirmed working by @bewallyt

[sleekLancelot]

Deleting the development client on my android and creating a new one with eas build --profile development --platform android did the trick for me. I guess react-native-svg contains some native code API, probably why we need a new build after downloading it.

[Revolt9k]

expo prebuild did nothing but npx react-native run-ios solved issue for me