expo: [SDK 50]: `compilerOptions.baseUrl` causes tamagui to not work once migrating from SDK 49.
Minimal reproducible example
Summary
I upgraded our monorepo from SDK 49 to SDK 50 now when it’s out of beta.
I followed the migration steps carefully, but it seems there might be a bug related to anyone utilizing the experimental path aliases feature where you had to set baseUrl
for the path aliases to work properly.
With SDK 50 and this feature now being on by default, there seems to be an issue how imports are resolved causing some dependencies to not work. I saw this with tamagui throwing createTamagui is not a function
.
Not sure if this is is a bug or known behavior now when this feature is on by default. If so, maybe a mention in the migration guide / Path Alias documentation might be helpful?
Temporary Fix
By removing baseUrl
I was able to get the project to run again.
Environment
expo-env-info 1.2.0 environment info:
System:
OS: macOS 14.2.1
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.16.0 - ~/.nvm/versions/node/v18.16.0/bin/node
Yarn: 1.22.21 - /opt/homebrew/bin/yarn
npm: 9.5.1 - ~/.nvm/versions/node/v18.16.0/bin/npm
Watchman: 2023.12.04.00 - /opt/homebrew/bin/watchman
Managers:
CocoaPods: 1.14.3 - /opt/homebrew/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 23.0, iOS 17.0, macOS 14.0, tvOS 17.0, watchOS 10.0
IDEs:
Xcode: 15.0.1/15A507 - /usr/bin/xcodebuild
npmPackages:
babel-preset-expo: ^10.0.1 => 10.0.1
expo: ^50.0.2 => 50.0.2
expo-router: ^3.4.4 => 3.4.4
react: 18.2.0 => 18.2.0
react-dom: 18.2.0 => 18.2.0
react-native: 0.73.2 => 0.73.2
react-native-web: ~0.19.10 => 0.19.10
Expo Workflow: bare
```
About this issue
- Original URL
- State: open
- Created 5 months ago
- Reactions: 3
- Comments: 16 (2 by maintainers)
I’ve found the solution somewhat, this is actually caused by Metro resolving css incorrectly I believe.
The problem is we generate a
tamagui.css
in the root folder. What happens is the expo metro config withisCSSEnabled
true will actually resolve totamagui.css
when youimport { View } from 'tamagui'
incorrectly.Likely it needs some logic to prefer a node module over a css file, which seems right. For now change your
tamagui.css
output to be a different name and it should fix.Confusing error! Took me a minute to isolate it.
@EvanBacon I can make our metro plugin change the resolution in this specific case, but I think this is probably a Metro footgun that could be fixed upstream.
In SDK 50, the baseUrl property is now more complaint with TypeScript according to the docs https://www.typescriptlang.org/tsconfig#baseUrl originally it was modeled more after a Vite plugin I found / Next.js (both were incorrect and caused mismatched behavior between the bundler and vs code). I imagine tamagui makes similar assumptions.
In SDK 50, the
baseUrl
must be defined, it no longer defaults to “.”. Also if thepaths
are matched and do not have a resolution, thenbaseUrl
is skipped. These are the main changes we made in SDK 50 https://github.com/expo/expo/pull/25510Could be related to: https://github.com/expo/expo/issues/26565
Since this is a core problem, lets hope it will be fixed soon in: https://github.com/expo/expo/issues/26565