ViewManagerResolver returned null for RNSVGCircle in React Native Expo app

[OrDavidA]

Description

I'm developing a React Native application using Expo. After adding a simple SVG component to my screen, the app crashes with this error:

ViewManagerResolver returned null for either RNSVGCircle or RCTRNSVGCircle, existing names are: [DebuggingOverlay, RCTSafeAreaView, RNSScreenFooter, RNSScreenContainer, AndroidProgressBar, RNSModalScreen, AndroidHorizontalScrollView, RCTText, AndroidHorizontalScrollContentView, RNCSafeAreaView, RCTView, RNSScreen, AndroidSwitch, ViewManagerAdapter_ExpoBlurView, RNSScreenStack, RNCSafeAreaProvider, RNSSearchBar, RNGestureHandlerButton, RCTModalHostView, RCTTextInlineImage, RCTWebView, RCTImageView, RNSScreenContentWrapper, RCTScrollView, AndroidDrawerLayout, RCTVirtualText, AndroidSwipeRefreshLayout, RCTRawText, RNSScreenStackHeaderSubview, AndroidTextInput, RNGestureHandlerRootView]

I installed react-native-svg (version 15.8.1) and tried to render a simple circle SVG:

import Svg, { Circle } from 'react-native-svg';

// In my component
<Svg height="50" width="50" viewBox="0 0 50 50">
  <Circle cx="25" cy="25" r="20" fill="#3CB371" />
</Svg>

I'm using EAS to build my development client. How can I fix this SVG rendering issue?

Snack or a link to a repository

Missing repo

SVG version

15.8.0

React Native version

0.76.7

Platforms

Android

JavaScript runtime

None

Workflow

None

Architecture

Fabric (New Architecture)

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes

[github-actions[bot]]

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

[github-actions[bot]]

Hey! 👋

It looks like you've omitted a few important sections from the issue template.

Please complete Steps to reproduce section.

[amarin13]

Same problem happening to me just for Android when building with npm run android (works fine when building with EAS). I've been playing with different solutions for 3 days and nothing seems to fix it.

My env:

"expo": "^52.0.44", "expo-application": "~6.0.2", "react": "18.3.1", "react-content-loader": "^6.2.0", "react-dom": "18.3.1", "react-native": "0.76.9", "react-native-svg": "15.8.0"

The funny thing is that the issue is only reproducible in Android when building with npm run android. After the build the errors appear when launching the app in the simulator (or physical device). But when I build the app with EAS build and launch the apk (either on emulator or device) it perfectly works.

To sum up:

• Android => issue reproducible on npm run android (on launching). When launching the final apk build by eas build works without issue.
• iOS => no issues in both eas build and npm run iOS

Any clue about it?

[jakex7]

After adding a native dependency, you need to update your development client by running:

npx expo prebuild --platform android

Then, rebuild the app with:

npx expo run:android

You can reed more about it here: https://docs.expo.dev/workflow/continuous-native-generation/

[amarin13]

@jakex7 I've done that many times and still the same issue. I've removed node_modules, clean package.lock, clean cache, use yarn instead of npm, changing to other react-native-svg versions...the issue is still there

[Rolando-Barbella]

Same is happening to me, I did: npx expo prebuild --platform android --clean, but still, the app crashes completly

[Rolando-Barbella]

Update: 1- npx expo prebuild --platform android --clean 2 - Delete the app 3 - npx expo run:android

It works with this 3 steps

[Sukkoth]

Faced the same issue, it was lucide-react-native package I was using. I removed all the icons I used from it and replaced with the one from expo icons. It worked this way.

So since it may be application bug, debug by turning off your pages and see which ones break, then to components and you will eventually get what's breaking it. for me, it was a page where I used the above package that broke it.

[Ayush-Ghiya]

Facing same issue but this solution worked: Thanks @Rolando-Barbella

Update: 1- npx expo prebuild --platform android --clean 2 - Delete the app 3 - npx expo run:android

It works with this 3 steps