Expo Go集成expo-auth-session谷歌登录遇ExpoApplication模块缺失错误

问题场景 #

在原生React Native项目（非Expo初始化项目）中使用Expo Go运行，引入expo-auth-session/providers/google后触发报错：

(NOBRIDGE) ERROR Error: Cannot find native module 'ExpoApplication'

已尝试重新安装依赖、重启应用，问题仍存在。

解决方案 #

1. 安装缺失的Expo原生模块 #

错误提示找不到ExpoApplication，首先安装对应的依赖：

npm install expo-application
# 或使用yarn
yarn add expo-application

2. 为原生React项目配置Expo Modules支持 #

原生React项目默认不包含Expo模块的配置，需要安装核心依赖并完成平台配置：

• 安装Expo Modules核心库：

  npm install expo-modules-core
  # 或yarn
  yarn add expo-modules-core
  

• iOS平台：执行pod安装以链接原生依赖

  npx pod-install
  

• Android平台：新版本expo-modules-core会自动配置，若未生效，可手动在项目根目录的settings.gradle中添加：

  apply from: new File(["node", "--print", "require.resolve('expo-modules-core/package.json')"].execute(null, rootDir).text.trim(), "../scripts/autolinking.gradle")
  

3. 对齐Expo相关依赖版本 #

确保项目中所有Expo依赖版本与Expo Go客户端版本一致，避免版本不兼容。例如Expo Go为49版本时，可在package.json中统一依赖版本：

"expo-auth-session": "~5.0.2",
"expo-application": "~5.3.0",
"expo-modules-core": "~1.5.7"

之后重新安装依赖：

npm install

4. 清理缓存并重启 #

• 清理包管理器缓存：

  npm cache clean --force
  # 或yarn
  yarn cache clean
  

• 重置Metro缓存并重启项目：

  npx react-native start --reset-cache
  

• 关闭并重新打开Expo Go客户端，重新加载项目

替代方案：使用原生React Native的Google登录库 #

若不想配置Expo模块，可改用react-native-google-signin，这是专为原生React Native项目设计的Google登录方案，无需依赖Expo生态：

npm install @react-native-google-signin/google-signin

原代码说明 #

你的Google登录代码本身逻辑无问题，问题出在原生项目对Expo模块的支持缺失，完成上述配置后即可正常运行：

import React, { useState, useEffect } from "react";
import { View, Text, Button } from "react-native";
import * as WebBrowser from "expo-web-browser";
import * as Google from "expo-auth-session/providers/google";
import AsyncStorage from "@react-native-async-storage/async-storage";
import {IOS_CLIENT_ID, WEB_CLIENT_ID } from "@env";

WebBrowser.maybeCompleteAuthSession();

export default function GoogleSignInScreen() {
  const [userInfo, setUserInfo] = useState(null);

  // Configuration Google OAuth
  const [request, response, promptAsync] = Google.useAuthRequest({
    clientId: WEB_CLIENT_ID,
    iosClientId: IOS_CLIENT_ID,
  });

  useEffect(() => {
    if (response?.type === "success") {
      getUserInfo(response.authentication.accessToken);
    }
  }, [response]);

  const getUserInfo = async (token) => {
    try {
      const res = await fetch("https://www.googleapis.com/userinfo/v2/me", {
        headers: { Authorization: `Bearer ${token}` },
      });
      const user = await res.json();
      setUserInfo(user);
      await AsyncStorage.setItem("user", JSON.stringify(user));
    } catch (error) {
      console.error(error);
    }
  };

  return (
    <View style={{ flex: 1, justifyContent: "center", alignItems: "center" }}>
      <Text style={{ fontSize: 20, marginBottom: 20 }}>
        Se connecter avec Google
      </Text>
      {userInfo ? (
        <Text>Bienvenue, {userInfo.name}!</Text>
      ) : (
        <Button title="Sign in with Google" onPress={() => promptAsync()} />
      )}
    </View>
  );
}

内容的提问来源于stack exchange，提问作者0x3CE