CODEWITHSUNDEEP
react-nativeexpo
hemantmetal
hemantmetal

Reputation: 107

Invariant Violation: ViewPagerAndroid has been removed from React Native. Expo v35 to v39 Migration

Tried most of the solutions and even updated all the packages but none of them is working for me.

Touching this project after a while so was migrating from

React Native Expo v35 to v39.

Error Stack Trace:

Error Stack Trace

My list of packages:

package.json

  "dependencies": {
    "@apollo/react-components": "^3.0.1",
    "@apollo/react-hoc": "^3.1.1",
    "@apollo/react-hooks": "^3.0.0",
    "@react-native-community/async-storage": "~1.12.0",
    "@react-native-community/viewpager": "^4.1.6",
    "apollo-boost": "^0.4.4",
    "apollo-fetch": "^0.7.0",
    "apollo-link": "^1.2.13",
    "apollo-link-context": "^1.0.19",
    "crypto": "^1.0.1",
    "crypto-js": "^4.0.0",
    "expo": "^39.0.3",
    "expo-facebook": "~9.0.0",
    "expo-font": "~8.3.0",
    "expo-google-app-auth": "^8.0.0",
    "expo-image-picker": "~9.1.0",
    "expo-notifications": "~0.7.2",
    "graphql": "^14.4.2",
    "moment": "^2.24.0",
    "native-base": "^2.13.8",
    "react": "16.13.1",
    "react-apollo": "^3.1.3",
    "react-dom": "16.13.1",
    "react-native": "https://github.com/expo/react-native/archive/sdk-39.0.0.tar.gz",
    "react-native-aws3": "^0.0.9",
    "react-native-gesture-handler": "~1.7.0",
    "react-native-google-places-autocomplete": "^1.4.1",
    "react-native-material-ripple": "^0.9.1",
    "react-native-modal": "^11.5.6",
    "react-native-modal-datetime-picker": "^7.6.0",
    "react-native-multiple-select": "^0.5.3",
    "react-native-paper": "^3.0.0",
    "react-native-picker-select": "^6.3.3",
    "react-native-screens": "~2.10.1",
    "react-native-status-bar-height": "^2.4.0",
    "react-native-vector-icons": "^6.6.0",
    "react-native-web": "~0.13.7",
    "react-navigation": "^4.4.2",
    "react-navigation-drawer": "^1.4.0",
    "react-navigation-stack": "^1.7.3",
    "react-navigation-tabs": "^1.2.0",
    "react-redux": "^7.1.1",
    "redux": "^4.0.4",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0"
  },
  "devDependencies": {
    "@graphql-codegen/introspection": "^1.12.2",
    "@types/react": "~16.9.35",
    "@types/react-native": "~0.63.2",
    "babel-jest": "^24.9.0",
    "babel-preset-expo": "^8.3.0",
    "enzyme": "^3.10.0",
    "enzyme-adapter-react-16": "^1.15.1",
    "jest": "^24.9.0",
    "jest-environment-enzyme": "^7.1.1",
    "jest-enzyme": "^7.1.1",
    "react-test-renderer": "16.8.3",
    "typescript": "~3.9.2"
  },
  "private": true
}

Based on what I read, it's some package that is causing this issue.

Can someone please help me find the package based on the Trace Stack? I was unable to find it.

Upvotes: 3

Views: 618

Answers (1)

Dhaval Jardosh
Dhaval Jardosh

Reputation: 7309

Package Name: react-navigation.

How to search: Search for ViewPagerAndroid in your VS Code and don't exclude node_modules.

What you need to replace?

import {ViewPagerAndroid} from 'react-native'

with

import ViewPagerAndroid from '@react-native-community/viewpager'

NOTE: You will need to add @react-native-community/viewpager package

Upvotes: 4

Related Questions