Web: startup crash with react-native-web 0.21.3 when the react-native root is loaded (InputAccessoryView circular import) #704

What happened?

With Uniwind 1.12.1 and react-native-web 0.21.3, an Expo app crashes on web at startup:

TypeError: Cannot read properties of undefined (reading 'default')
    at Object.get [as InputAccessoryView] (…/_expo/static/js/web/entry-….js)

With web.output: 'single' the page stays blank and the error is in the console. With web.output: 'static' (the default create-expo-app template), expo export -p web already fails during static rendering with the same error.

The crash happens whenever something loads the react-native root on web. expo-router does this: its compiled code calls require('react-native'). apps/expo-example does not reproduce it as is, because babel-plugin-react-native-web rewrites its named imports to per-component modules, so the react-native-web root index is never loaded there.

Cause. The web InputAccessoryView added in #697 does import * as ReactNative from 'react-native' and reads ReactNative.InputAccessoryView ?? ReactNative.View at module scope. On web, Metro's webResolver redirects react-native-web's own ./exports/InputAccessoryView import (in react-native-web/dist/index.js) to uniwind/components/InputAccessoryView:

1. The react-native-web root index starts initializing and requires ./exports/InputAccessoryView, which now resolves to the Uniwind wrapper.
2. The wrapper imports the root index again. That is a circular import, so the wrapper gets the partially initialized exports object.
3. The module-scope read of InputAccessoryView calls the root index getter before _exportsInputAccessoryView2 is assigned, and it throws.

The other web wrappers use named imports, which babel-plugin-react-native-web rewrites to react-native-web/dist/exports/<Component>. They never touch the root index.

Fresh installs of Expo SDK 57 and 58 resolve react-native-web ~0.21.0 and babel-plugin-react-native-web ~0.21.0 (from babel-preset-expo) to 0.21.3, so new Expo Router apps hit this on web.

A fix with a regression test is in #703. This replaces #702, which I opened without the issue form by mistake.

Steps to Reproduce

Fresh Expo app:

1. npx create-expo-app@latest repro --template default@sdk-57, then install dependencies. react-native-web and babel-plugin-react-native-web resolve to 0.21.3.
2. Add Uniwind 1.12.1 as in the quickstart: uniwind@1.12.1 and tailwindcss@4.3.3, metro.config.js with withUniwindConfig(getDefaultConfig(__dirname), { cssEntryFile: './src/uniwind.css' }), src/uniwind.css containing @import 'tailwindcss'; @import 'uniwind';, and import '../uniwind.css' at the top of src/app/_layout.tsx.
3. Run npx expo export -p web. It fails with the error above.
4. Pin react-native-web@0.21.2 and export again. The export succeeds and the app renders.

In this repository, using the linked branch:

1. In the branch, apps/expo-example/App.tsx has one added line: import * as ReactNative from 'react-native'.
2. Run bun install, then bun run build in packages/uniwind.
3. Run npx expo export -p web in apps/expo-example, serve dist, and open it. The page is blank and the console shows the error.

Snack or Repository Link

https://github.com/dmitryshostak/uniwind/tree/repro/web-input-accessory-view-crash

Uniwind version

1.12.1

React Native Version

0.86.3 (Expo SDK 57.0.26); also 0.88.0-rc.3 (Expo SDK 58.0.0)

Platforms

Web

Expo

Yes

Additional information 〰

• I've searched for similar issues in this repository and found none