Description
Minimal reproducible example
https://github.com/vruffer/expo-router-minimal-repro
Which package manager are you using? (Yarn is recommended)
npm
If the issue is web-related, please select the bundler (web.bundler
in the app.json
)
None
Summary
Router @react-navigation
exports loose type information when tsconfig.moduleResolution
is set to Bundler
.
Using a tab/stack navigator as shown in the repro with moduleResolution: Bundler
causes typescript to loose all type information about the component.
I think this is because of the new way types are exported in react-navigation@7
, mainly that types are split for module and commonjs exports: @react-navigation/{module}/lib/typescript/{commonjs or module}/src/index
.
Expo types are hard-coded to always use the commonjs
export, and access subpaths which typescript can't seem to resolve. e.g. an import like import("@react-navigation/bottom-tabs/lib/typescript/commonjs/src/types").BottomTabNavigationConfig
in expo-router/build/layouts/TabsClient.d.ts
line 10, does not work and resolves to any
.
I've tried changing the hard-coded imports in TabsClient.d.ts
to point to the module
subpath: import("@react-navigation/bottom-tabs/lib/typescript/module/src/types").BottomTabNavigationConfig
, but it seems the typing breaks as soon as an import statement accesses subpaths that aren't explicitely defined in @react-navigation
s package.json.exports
field.
Importing from @react-navigation
directly works fine.
I use packages that must use the package.json.exports
field, and since moduleResolution: 'node'
does not support package.json.exports
, I am forced to use moduleResolution: 'Bundler'
. It works on expo@51/expo-router@~3.5.23
.
Environment
expo-env-info 1.2.1 environment info:
System:
OS: macOS 14.7
Shell: 5.9 - /bin/zsh
Binaries:
Node: 20.18.0 - ~/.local/state/fnm_multishells/28953_1731489883943/bin/node
Yarn: 4.5.1 - ~/.local/state/fnm_multishells/28953_1731489883943/bin/yarn
npm: 10.8.2 - ~/.local/state/fnm_multishells/28953_1731489883943/bin/npm
Watchman: 2024.09.09.00 - ~/Applications/homebrew/bin/watchman
Managers:
CocoaPods: 1.15.2 - ~/.rbenv/shims/pod
SDKs:
iOS SDK:
Platforms: DriverKit 24.0, iOS 18.0, macOS 15.0, tvOS 18.0, visionOS 2.0, watchOS 11.0
IDEs:
Android Studio: 2024.1 AI-241.18034.62.2411.12071903
Xcode: 16.0/16A242d - /usr/bin/xcodebuild
npmPackages:
expo: ~52.0.4 => 52.0.4
expo-router: ~4.0.3 => 4.0.3
react: 18.3.1 => 18.3.1
react-dom: 18.3.1 => 18.3.1
react-native: 0.76.1 => 0.76.1
react-native-web: ~0.19.13 => 0.19.13
Expo Workflow: managed