Closed2024/06/02にクローズ3

Expo Router バージョンアップ (v2 → v3) トラブル

React Native

matsu

Expo Router バージョンアップ (v2 → v3) トラブル

expo 49.0.21 → 51.0.8
expo-router 2.0.14 → 3.5.14

matsu

エラーメッセージ

Render Error
Cannot read property 'match' of undefined

Call Stack
getRootDir Tutorial.js:67:14

該当箇所

// expo-router > build > onboard > Tutorial.js > getRootDir

function getRootDir() {
    const dir = process.env.EXPO_ROUTER_ABS_APP_ROOT;
    if (dir.match(/\/src\/app$/)) {
        return 'src/app';
    }
    else if (dir.match(/\/app$/)) {
        return 'app';
    }
    return dir.split('/').pop() ?? dir;
}

process.env.EXPO_ROUTER_ABS_APP_ROOT がうまく取れてないっぽい

解決策

babel.config.js から、plugin transform-inline-environment-variables を削除

ちゃんと書いてありました https://docs.expo.dev/guides/environment-variables/#from-babel-plugin-transform-inline-environment-variables

matsu

エラー

続けて、src/app/index.js が見つからない問題が。

app 直下に index.js は置いておらず、_layout.tsx にて以下のように設定して app/(anon)/index.tsx が初期ルートになるようにしていたが、これが問題っぽい。

export const unstable_settings = {
  initialRouteName: "(anon)",
};

解決策

babel.config.js から module:react-native-dotenv を削除したらなぜか解決。当該プロジェクトでは react-native-dotenv 使ってなかったので、とりあえず削除で対応した。

このスクラップは2024/06/02にクローズされました