我該如何解決這個錯誤 Invariant Violation: ViewPropTypes has been removed from React Native

Question

如何解決這個錯誤我正在使用 expo react native ERROR Invariant Violation: ViewPropTypes has been removed from React Native。 遷移到從 'deprecated-react-native-prop-types' 導出的 ViewPropTypes。 這是錯誤請檢查我提供的代碼

我的 package.json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject"
  },
  "dependencies": {
    "@react-native-community/masked-view": "0.1.10",
    "@react-navigation/bottom-tabs": "^5.11.10",
    "@react-navigation/compat": "^5.3.20",
    "@react-navigation/native": "^5.9.4",
    "@react-navigation/stack": "^5.14.4",
    "expo": "^46.0.0",
    "expo-av": "~12.0.4",
    "expo-linear-gradient": "~11.4.0",
    "expo-status-bar": "~1.4.0",
    "haversine": "^1.1.1",
    "react": "18.0.0",
    "react-dom": "18.0.0",
    "react-native": "0.69.5",
    "react-native-animatable": "^1.3.3",
    "react-native-flexi-radio-button": "^0.2.2",
    "react-native-fontawesome": "^7.0.0",
    "react-native-gesture-handler": "~2.5.0",
    "react-native-modal": "^13.0.0",
    "react-native-modalize": "^2.0.8",
    "react-native-progress-circle": "^2.1.0",
    "react-native-reanimated": "~2.9.1",
    "react-native-safe-area-context": "4.3.1",
    "react-native-screens": "~3.15.0",
    "react-native-snap-carousel": "^3.9.1",
    "react-native-swiper": "^1.6.0",
    "react-native-web": "~0.18.7",
    "react-navigation": "^4.4.4",
    "rn-sliding-up-panel": "^2.4.5"
  },
  "devDependencies": {
    "@babel/core": "^7.18.6"
  },
  "private": true
}

我的應用程序.json

{
  "expo": {
    "name": "amdy-edu",
    "slug": "amdy-edu",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "ios": {
      "supportsTablet": true
    },
    "android": {
      "adaptiveIcon": {
        "foregroundImage": "./assets/adaptive-icon.png",
        "backgroundColor": "#FFFFFF"
      }
    },
    "web": {
      "favicon": "./assets/favicon.png"
    }
  }
}

我的 babel.config.js

module.exports = function(api) {
  api.cache(true);
  return {
    presets: ['module:metro-react-native-babel-preset'],
    plugins: ['react-native-reanimated/plugin'],
  };
};

Answer 1

正確的解決方法是切換到deprecated-react-native-prop-types或像 Typescript 這樣的類型系統。

Answer 2

問題在於 react-native-snap-carousel。 你有2個選擇。 您要么找到替代方案，要么導航到 node_modules/react-native-snap-carousel 並將所有導入更改為不推薦使用的類型。

Answer 3

這幫助我解決了同樣的問題，改用這個。

npm i git+https://github.com/LarvenLLC/react-native-snap-carousel.git

參考： https://github.com/meliorence/react-native-snap-carousel/pull/929#issuecomment-1221294797