Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Weird Display in RN V0.68 New Architecture Enabled

See original GitHub issue

Bug

Svg does not show in rn v0.68.0-rc.2 with new architecture enabled instead it shows a strange Text of 'RNSVGRect' WhatsApp Image 2022-02-26 at 02 25 32 (1)

react-native init CleanProject --version 0.68.0-rc.2
cd CleanProject/
yarn add react-native-svg
modify android/gradle.properties -> and change to newArchEnabled=true
run the app -> react-native run-android

Environment info

React native info output:

 System:
    OS: macOS 11.6.2
    CPU: (4) x64 Intel(R) Core(TM) m3-7Y32 CPU @ 1.10GHz
    Memory: 311.86 MB / 8.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.13.2 - /usr/local/bin/node
    Yarn: 3.1.1 - /usr/local/bin/yarn
    npm: 8.1.2 - /usr/local/bin/npm
    Watchman: Not Found
  Managers:
    CocoaPods: 1.11.2 - /usr/local/bin/pod
  SDKs:
    iOS SDK:
      Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3
    Android SDK: Not Found
  IDEs:
    Android Studio: 2020.3 AI-203.7717.56.2031.7935034
    Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild
  Languages:
    Java: 11.0.10 - /usr/bin/javac
  npmPackages:
    @react-native-community/cli: Not Found
    react: 17.0.2 => 17.0.2 
    react-native: 0.68.0-rc.2 => 0.68.0-rc.2 
    react-native-macos: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

Library version: ^12.1.1

Steps To Reproduce

react-native init CleanProject --version 0.68.0-rc.2
cd CleanProject/
yarn add react-native-svg
modify android/gradle.properties -> and change to newArchEnabled=true
yarn android

Describe what you expected to happen:

Display svg correctly

Issue Analytics

State:
Created 2 years ago
Comments:10 (1 by maintainers)

Top GitHub Comments

3reactions

myckhelcommented, Feb 28, 2022

@kelset Example repo has been created at https://github.com/myckhel/svg-fabric-unsupported

Running App

yarn install && yarn android

Screenshot_1646063603

2reactions

WoLewickicommented, Aug 19, 2022

I think we can close this issue now since Fabric support is released. Although, if you want to use it on Android in RN version < 0.70.0-rc.3, you need to link the components manually. There is already an issue for how to do it which I plan to resolve ASAP: https://github.com/react-native-svg/react-native-svg/issues/1839. Feel free to comment here if something is wrong and we can always reopen it then.