How can i use react-native-svg With RNW Fabric NewArchEnabled

[AlkanV]

Description
After installing react-native-svg@15.12.1 in a React Native Windows app (RN 0.79 / RNW 0.79, new architecture / Fabric), auto-linking generates this in AutolinkedNativeModules.g.cpp:

`// Includes from react-native-svg
#include <winrt/RNSVG.h>

// IReactPackageProviders from react-native-svg
packageProviders.Append(winrt::RNSVG::ReactPackageProvider());`

…but the build fails with:

fatal error C1083: Cannot open include file: 'winrt/RNSVG.h': No such file or directory

Env info

React Native: 0.79.x
React Native Windows: 0.79.x (new architecture / Fabric enabled)
react-native-svg: 15.12.1
Platform: Windows 11 (x64)
Visual Studio: VS 2022 17.x
Windows SDK: (e.g.) 10.0.22621
Autolinking: @react-native-community/cli windows autolink
Architecture: x64 (Debug/Release both impacted)

Note: In Solution Explorer the RNSVG project shows “(Universal Windows)”. RNW 0.79 apps target WinAppSDK / WinUI 3 (not UWP). The UWP project type appears to be why VS marks it ignored/unloaded, which prevents WinMD/header generation.

What I tried

Re-running autolink-windows (apply mode, not --check)
Cleaning windows\x64 and rebuilding
Verifying ProjectReference to RNSVG.vcxproj exists (it does)
Ensuring the generated AutolinkedNativeModules.g.cpp is unmodified (it is)
Installing/repairing Windows SDK; the project still shows as Universal Windows and ignored

Additional context / suspected cause

react-native-svg’s Windows project appears to target UWP (“Universal Windows”) while RNW 0.79 uses WinAppSDK/WinUI 3. In this configuration, the RNSVG project does not load/build in VS 2022, so the expected RNSVG.winmd is never produced and C++/WinRT does not generate winrt/RNSVG.h for the app. Autolink then includes a header that doesn’t exist, causing the compile failure.

Steps to reproduce
Create a fresh RN 0.79 project and add Windows:
npx react-native init SvgWinRepro --version 0.79.0
cd SvgWinRepro
npx @react-native-windows/cli init --version 0.79

Install SVG and autolink:
npm i react-native-svg@15.12.1
npx @react-native-community/cli autolink-windows --sln "windows\SvgWinRepro.sln" --proj "windows\SvgWinRepro\SvgWinRepro.vcxproj"

3.Observe project RNSVG (Universal Windows) has a red “ignored/unloaded” glyph and cannot be built/loaded.

4.Build the solution (x64, Debug).

Compile fails in app project:
fatal error C1083: Cannot open include file: 'winrt/RNSVG.h'

SVG version
15.12.1

React Native version
0.79

Platforms
Windows

Architecture
Fabric (New Architecture)

Device model
Windows

[IamJignesh]

Bit of late response, but might help someone else, I solved it by changing the Target Platform Version of RNSVG project

This how the project looks like when initially added

I modified to match with the same target platform version as the my main project:

After this change I was able to build and use the RNSVG library but there are still some issue like there is a black background shown for each SVG in my app as below, maybe I need to make some changes to my SVG files:

[IamJignesh]

Update:

setting fill to none solved the background being black issue