react-native-svg icon indicating copy to clipboard operation
react-native-svg copied to clipboard

Windows : [Fabric] [NewArch] [Win32Sdk] [RN 0.79 / RNW 0.79] Autolink includes <winrt/RNSVG.h> but header is missing; RNSVG project shows “(Universal Windows)” and is ignored/unloaded — build fails

Open AlkanV opened this issue 4 months ago • 3 comments

Description

After installing [email protected] 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

  1. 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

  1. Install SVG and autolink:

npm i [email protected] 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'

Snack or a link to a repository

can't create win32 app in snack

SVG version

15.12.1

React Native version

0.79

Platforms

macOS

JavaScript runtime

None

Workflow

None

Architecture

Fabric (New Architecture)

Build type

Debug app & dev bundle

Device

Real device

Device model

Windows

Acknowledgements

Yes

AlkanV avatar Aug 19 '25 10:08 AlkanV

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] avatar Aug 19 '25 10:08 github-actions[bot]

same

thrueweather avatar Oct 07 '25 10:10 thrueweather

Im having issues with version 0.79 as well, though with a different problem, something related to the Joi library. I checked the Windows implementation of the react-native-svg, and honestly, i was quite surprised. It seems that half of the code uses the old way of calling Win32 APIs, while the other half uses the newer, correct approach. For example, some parts use winrt::Windows, while others use winrt::Microsoft.

I tried rewriting a bit of it to work with the new SDK, but its a pretty long process. I will prioritize finishing my app first, and then, when I have more time, I will come back to it. Honestly, though, it would be much faster for the original developers to do it, since they are already familiar with the code and could more easily update it to the new Win32 calling style. Also i am pretty sure that they will have to use new overwrite option, because config recognizes only UWP tamplate (since it was created with it). And instead use cpp-lib or cpp-app (i think cpp-app)

Choco-milk-for-u avatar Oct 09 '25 22:10 Choco-milk-for-u

I would also like to see this working as https://github.com/microsoft/fluentui-react-native lists it as a dependency.

KGGrande avatar Nov 07 '25 15:11 KGGrande