Hey! First off, thanks for the amazing work on both react-native-skia and react-native-wgpu !!
I just hit an issue upgrading to Expo SDK 55 — the iOS build breaks when both packages are installed together. Wanted to flag it and ask for guidance on the right approach.
The issue
After upgrading to @shopify/react-native-skia@2.4.18, the iOS build fails with ~20 C++ compilation errors. It looks like Skia now bundles its own copy of the wgpu C++ layer (since v2.4.16 / PR #3652), and some header files (NativeObject.h, JSIConverter.h, EnumMapper.h, Promise.h) share the same name in both packages. CocoaPods exposes both sets of headers, and the compiler picks up the wrong one.
If I remove react-native-wgpu, the build succeeds. But I need both packages because I use libraries like typegpu-confetti which imports directly from react-native-wgpu:
// typegpu-confetti/react-native/index.js
import { Canvas, useCanvasRef, useDevice } from "react-native-wgpu";
Questions
-
Are these two packages meant to coexist? Should I still have react-native-wgpu installed alongside react-native-skia >= 2.4.16, or is there a new way to access the WebGPU API through Skia directly?
-
If they should coexist, is there a fix in the works for the header collision? Happy to test a patch or help in any way.
-
If react-native-wgpu is being absorbed into Skia, how should libraries like typegpu-confetti that import Canvas/useDevice/useCanvasRef from react-native-wgpu adapt? Skia doesn't seem to re-export those JS APIs currently.
Environment
|
Version |
react-native-wgpu |
0.5.6 |
@shopify/react-native-skia |
2.4.18 |
| React Native |
0.83.2 |
| Expo SDK |
55 |
| Xcode |
26.2 |
| CocoaPods |
1.16.2 |
| Platform |
iOS Simulator (arm64) |
Reproduction
# In any React Native 0.83+ / Expo SDK 55 project with both packages:
yarn add react-native-wgpu@0.5.6 @shopify/react-native-skia@2.4.18
npx expo prebuild --platform ios --clean
xcodebuild -workspace ios/<Project>.xcworkspace \
-scheme <Project> -configuration Debug \
-sdk iphonesimulator build
# → BUILD FAILED with ~20 errors
Removing react-native-wgpu makes the build pass.
Technical details
Root cause analysis and build errors (click to expand)
Colliding headers
Since v2.4.16, Skia ships a forked copy of wgpu's C++ JSI infrastructure. 5 files share the same name but differ in namespace references (rnwgpu::RuntimeAwareCache in wgpu vs RNJsi::RuntimeAwareCache in Skia's fork):
| File |
wgpu |
Skia |
NativeObject.h |
cpp/jsi/ |
cpp/jsi2/ |
JSIConverter.h |
cpp/jsi/ |
cpp/jsi2/ |
EnumMapper.h |
cpp/jsi/ |
cpp/jsi2/ |
Promise.h |
cpp/jsi/ |
cpp/jsi2/ |
RuntimeAwareCache.h |
cpp/jsi/ (namespace rnwgpu) |
cpp/jsi/ (namespace RNJsi) |
Both podspecs use "cpp/**/*.{h,cpp}" as source_files, so CocoaPods symlinks both into shared header directories. When wgpu does #include "NativeObject.h", it resolves to Skia's fork which references RNJsi:: symbols — undefined in wgpu's context.
Build errors (verbatim)
.../react-native-skia/cpp/jsi2/NativeObject.h:90:3: error: use of undeclared identifier 'RNJsi'
90 | RNJsi::RuntimeAwareCache<T> *cache = nullptr;
.../react-native-skia/cpp/jsi2/NativeObject.h:93:3: error: use of undeclared identifier 'RNJsi'
93 | RNJsi::RuntimeAwareCache<T> &get(jsi::Runtime &rt) {
.../react-native-skia/cpp/jsi2/NativeObject.h:94:24: error: use of undeclared identifier 'RNJsi'
94 | auto mainRuntime = RNJsi::BaseRuntimeAwareCache::getMainJsRuntime();
... cascading into wgpu API classes:
.../react-native-wgpu/cpp/rnwgpu/api/GPUBuffer.h:30:9: error: member initializer 'NativeObject' does not name a non-static data member or base class
.../react-native-wgpu/cpp/rnwgpu/api/GPUBuffer.h:55:5: error: use of undeclared identifier 'installGetter'
fatal error: too many errors emitted, stopping now [-ferror-limit=]
20 errors generated.
Thanks for your time, happy to help test anything!
Hey! First off, thanks for the amazing work on both react-native-skia and react-native-wgpu !!
I just hit an issue upgrading to Expo SDK 55 — the iOS build breaks when both packages are installed together. Wanted to flag it and ask for guidance on the right approach.
The issue
After upgrading to
@shopify/react-native-skia@2.4.18, the iOS build fails with ~20 C++ compilation errors. It looks like Skia now bundles its own copy of the wgpu C++ layer (since v2.4.16 / PR #3652), and some header files (NativeObject.h,JSIConverter.h,EnumMapper.h,Promise.h) share the same name in both packages. CocoaPods exposes both sets of headers, and the compiler picks up the wrong one.If I remove
react-native-wgpu, the build succeeds. But I need both packages because I use libraries liketypegpu-confettiwhich imports directly fromreact-native-wgpu:Questions
Are these two packages meant to coexist? Should I still have
react-native-wgpuinstalled alongsidereact-native-skia>= 2.4.16, or is there a new way to access the WebGPU API through Skia directly?If they should coexist, is there a fix in the works for the header collision? Happy to test a patch or help in any way.
If
react-native-wgpuis being absorbed into Skia, how should libraries liketypegpu-confettithat importCanvas/useDevice/useCanvasReffromreact-native-wgpuadapt? Skia doesn't seem to re-export those JS APIs currently.Environment
react-native-wgpu@shopify/react-native-skiaReproduction
Removing
react-native-wgpumakes the build pass.Technical details
Root cause analysis and build errors (click to expand)
Colliding headers
Since v2.4.16, Skia ships a forked copy of wgpu's C++ JSI infrastructure. 5 files share the same name but differ in namespace references (
rnwgpu::RuntimeAwareCachein wgpu vsRNJsi::RuntimeAwareCachein Skia's fork):NativeObject.hcpp/jsi/cpp/jsi2/JSIConverter.hcpp/jsi/cpp/jsi2/EnumMapper.hcpp/jsi/cpp/jsi2/Promise.hcpp/jsi/cpp/jsi2/RuntimeAwareCache.hcpp/jsi/(namespace rnwgpu)cpp/jsi/(namespace RNJsi)Both podspecs use
"cpp/**/*.{h,cpp}"assource_files, so CocoaPods symlinks both into shared header directories. When wgpu does#include "NativeObject.h", it resolves to Skia's fork which referencesRNJsi::symbols — undefined in wgpu's context.Build errors (verbatim)
Thanks for your time, happy to help test anything!