software-mansion / react-native-svg

SVG library for React Native, React Native Web, and plain React web projects.
MIT License
7.51k stars 1.14k forks source link

Unable to build react-native-windows app (new Architecture) with react-native-svg #2547

Open pcprinz opened 4 days ago

pcprinz commented 4 days ago

Description

react-native-svg prevents react-native-windows apps with the new architecture from building. I tested it with rnw@0.75 and rnw@0.76 both with the cpp-app template from rnw which implements the new architecture. Then I installed the most recent version of react-native-svg (15.9.0) and the react-native-windows app doesn't build any more:

 i Build configuration: Debug
 i Build platform: x64
 × Building Solution: C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(164): error MIDL2011...
 × Build failed with message 2:10>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(18): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.Composition.CreateCompositionComponentViewArgs [ Parameter 'args' of Procedure 'SvgView' ( RuntimeClass 'RNSVG.SvgView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj]. Check your build configuration.
Command failed. Re-run the command with --logging for more information.
error Command failed with exit code 2302.
Detailed error message

``` 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(18): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.Composition.CreateCo mpositionComponentViewArgs [ Parameter 'args' of Procedure 'SvgView' ( RuntimeClass 'RNSVG.SvgView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj ] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(28): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'RenderableView' ( RuntimeClass 'RNSVG.RenderableView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(38): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'RectView' ( RuntimeClass 'RNSVG.RectView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(45): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'CircleView' ( RuntimeClass 'RNSVG.CircleView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(52): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'EllipseView' ( RuntimeClass 'RNSVG.EllipseView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(59): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'LineView' ( RuntimeClass 'RNSVG.LineView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(66): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'PathView' ( RuntimeClass 'RNSVG.PathView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(73): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'UseView' ( RuntimeClass 'RNSVG.UseView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(80): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'ImageView' ( RuntimeClass 'RNSVG.ImageView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(87): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'GroupView' ( RuntimeClass 'RNSVG.GroupView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(94): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentViewA rgs [ Parameter 'args' of Procedure 'TextView' ( RuntimeClass 'RNSVG.TextView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(101): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'TSpanView' ( RuntimeClass 'RNSVG.TSpanView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(108): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'DefsView' ( RuntimeClass 'RNSVG.DefsView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(115): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'SymbolView' ( RuntimeClass 'RNSVG.SymbolView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(122): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'ClipPathView' ( RuntimeClass 'RNSVG.ClipPathView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(129): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'MarkerView' ( RuntimeClass 'RNSVG.MarkerView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(136): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'MaskView' ( RuntimeClass 'RNSVG.MaskView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(143): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'BrushView' ( RuntimeClass 'RNSVG.BrushView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(150): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'LinearGradientView' ( RuntimeClass 'RNSVG.LinearGradientView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj ] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(157): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'RadialGradientView' ( RuntimeClass 'RNSVG.RadialGradientView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj ] 3>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(164): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.CreateComponentView Args [ Parameter 'args' of Procedure 'PatternView' ( RuntimeClass 'RNSVG.PatternView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] [...] × Building Solution × Build failed with message 3:10>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(18): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.Composition.CreateCompositionComponentViewArgs [ Parameter 'args' of Procedure 'SvgView' ( RuntimeClass 'RNSVG.SvgView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj]. Check your build configuration. i Gathering MSBuild data for telemetry. i Loading properties from msbuildproperties.g.json Command failed with error MSBuildError: 3:10>C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\Fabric.idl(18): error MIDL2011: [msg]unresolved type declaration [context]: Microsoft.ReactNative.Composition.CreateCompositionComponentViewArgs [ Parameter 'args' of Procedure 'SvgView' ( RuntimeClass 'RNSVG.SvgView' ) ] [C:\dev\RNWTests\node_modules\react-native-svg\windows\RNSVG\RNSVG.vcxproj] Your telemetry sessionId was 5e32dd50e98abbc4069b97edcac1608c error Command failed with exit code 2302. ```

Repos:

Steps to reproduce

  1. install react-native at Version 0.75+
  2. install react-native-windows at the same version but with --template cpp-app
  3. install react-native-svg at Version 15.9.0
  4. run npx react-native run-windows

Snack or a link to a repository

https://github.com/pcprinz/react-native-windows-tests/tree/0.75-failing-rn-svg

SVG version

15.9.0

React Native version

0.75.4

Platforms

Android, iOS, macOS, Web

JavaScript runtime

Hermes

Workflow

React Native

Architecture

Fabric (New Architecture)

Build type

None

Device

None

Device model

No response

Acknowledgements

Yes