不变违规：requireNativeComponent：在 UIManager 中找不到“RNCViewPager”。 Android 构建

Question

在使用 EAS 完成 Expo 项目的构建过程后，我遇到了以下错误：

不变违规：requireNativeComponent：在 UIManager 中找不到“RNCViewPager”。

此错误仅在 Android 版本中出现，在 iOS 中不会出现。下面，您将找到我的 package.json、app config 和 app.json 文件以供参考：

{
  "name": "****",
  "version": "1.0.0",
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web"
  },
  "dependencies": {
    "@config-plugins/react-native-ble-plx": "^7.0.0",
    "@react-native-async-storage/async-storage": "1.18.2",
    "@react-native-firebase/app": "^18.3.2",
    "@react-native-firebase/auth": "^18.3.2",
    "@react-native-firebase/firestore": "^18.3.2",
    "@react-native-firebase/storage": "^18.3.2",
    "@react-navigation/material-top-tabs": "^6.6.3",
    "@react-navigation/native": "^6.1.7",
    "@react-navigation/native-stack": "^6.9.13",
    "@shopify/react-native-skia": "0.1.196",
    "expo": "~49.0.5",
    "expo-build-properties": "~0.8.3",
    "expo-checkbox": "~2.4.0",
    "expo-dev-client": "~2.4.8",
    "expo-device": "~5.4.0",
    "expo-font": "~11.4.0",
    "expo-image-picker": "~14.3.2",
    "expo-linking": "~5.0.2",
    "expo-splash-screen": "~0.20.5",
    "expo-status-bar": "~1.6.0",
    "firebase": "^10.1.0",
    "react": "18.2.0",
    "react-native": "0.72.4",
    "react-native-base64": "^0.2.1",
    "react-native-ble-plx": "^2.0.3",
    "react-native-confirmation-code-field": "^7.3.1",
    "react-native-dotenv": "^3.4.9",
    "react-native-gesture-handler": "~2.12.0",
    "react-native-get-random-values": "~1.9.0",
    "react-native-modal": "^13.0.1",
    "react-native-pager-view": "^6.2.1",
    "react-native-phone-number-input": "^2.1.0",
    "react-native-qrcode-svg": "^6.2.0",
    "react-native-reanimated": "~3.3.0",
    "react-native-reanimated-carousel": "^3.5.1",
    "react-native-responsive-fontsize": "^0.5.1",
    "react-native-safe-area-context": "4.6.3",
    "react-native-screens": "~3.22.0",
    "react-native-svg": "13.9.0",
    "react-native-tab-view": "^3.5.2",
    "react-native-webview": "13.2.2",
    "uuid": "^9.0.0"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@types/react": "~18.2.14",
    "@types/react-native-base64": "^0.2.0",
    "@types/uuid": "^9.0.2",
    "babel-plugin-module-resolver": "^5.0.0",
    "typescript": "^5.1.3"
  },
  "private": true
}

app.json /app.config.ts

{
  "expo": {
    "name": "*",
    "slug": "*",
    "extra": {
      "eas": {
        "projectId": "****"
      }
    },
    "scheme": "*",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "userInterfaceStyle": "light",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "assetBundlePatterns": ["**/*"],

    "plugins": [
      "@react-native-firebase/app",
      "@react-native-firebase/auth",
      [
        "expo-build-properties",
        {
          "ios": {
            "useFrameworks": "static"
          }
        }
      ],
      [
        "expo-image-picker",
        {
          "photoPermissions": "Diese App benötigt Zugriff auf Ihre Fotos, um deine Profilbilder zu ändern.",
          "cameraPermissions": "Diese App benötigt Zugriff auf deine Kamera, um deine Profilbilder zu ändern."
        }
      ]
    ]
  }
}

import { ExpoConfig, ConfigContext } from "@expo/config";
import * as dotenv from "dotenv";

dotenv.config();

export default ({ config }: ConfigContext): ExpoConfig => ({
  ...config,
  slug: "**",
  name: "**",
  ios: {
    supportsTablet: true,
    bundleIdentifier: "*",
    googleServicesFile:
      process.env.IOS_GOOGLE_SERVICES ?? "./GoogleService-Info.plist",
  },
  android: {
    versionCode: 1,

    adaptiveIcon: {
      foregroundImage: "./assets/adaptive-icon.png",
      backgroundColor: "#FFFFFF",
    },
    googleServicesFile:
      process.env.ANDROID_GOOGLE_SERVICES ?? "./google-services.json",
    package: "*",
    // Permission for camera and gallery
    permissions: ["CAMERA", "READ_EXTERNAL_STORAGE", "WRITE_EXTERNAL_STORAGE"],
  },
});

很明显，我正在使用 Expo SDK 49。

我已尝试以下故障排除步骤：

Deleted the node_modules folder and performed a fresh installation.
Rebuilt the project.
Solely employed react-native-pager-view, which still resulted in the same error, strongly indicating its association with this particular package.

值得注意的是，这些软件包会定期更新，这让我此时遇到这个问题有些困惑。我遇到的与此错误相关的所有已知问题似乎与 Expo 无关。

供您参考，这是我实现它的代码部分。我正在使用@react-navigation/material-top-tabs，它又依赖于react-native-pager-view。

    import { View } from "react-native";
import React from "react";

// Packages
import { createMaterialTopTabNavigator } from "@react-navigation/material-top-tabs";
// Headers
import HomeHeader from "~/components/Header/Home";
import Text from "~/components/common/Text";

// Screens
import RadarScreen from "~/screens/Spark/RadarScreen";
import NetworkScreen from "~/screens/Spark/NetworkScreen";
import ReloadScreen from "~/screens/Spark/ReloadScreen";
const Tab = createMaterialTopTabNavigator();

function MainStack() {
  return (
    <Tab.Navigator tabBar={() => null}>
      <Tab.Screen name="Network" component={NetworkScreen} />
      <Tab.Screen name="Radar" component={RadarScreen} />
      <Tab.Screen name="Reload" component={ReloadScreen} />
    </Tab.Navigator>
  );
}

export default MainStack;

如果有什么方法可以提高我的问题写作能力，请告诉我。 Stack Overflow 已发出有关因不喜欢而可能被屏蔽的警告，因此，任何有关如何增强我的问题的指导将不胜感激。祝你有美好的一天

Answer 1

这个问题与 @react-navigation/material-top-tabs 包有关。已解决这里。

安装库：

npm 我反应本机寻呼机视图

从模拟器/设备中卸载您的应用程序并使用以下命令重建它：

react-native 运行 android