Request failed with status 403, react-native-screens.js, react-native-stack.js

Viewed 1742

I'm new to this website. I'm developing a mobile app using Expo Snack. I have a question on React Navigation, React Native. I would really appreciate it if you could help me.

I've stacked when using StackNavigator in React Navigation. It'd been working fine until 2 days ago, but suddenly it display error message that

'Request failed with status 403: undefined Evaluating module://react-native-screens.js Evaluating module://react-navigation-stack.js....'

My code concerning this issue is below.

Nav.js

import { createStackNavigator } from 'react-navigation-stack';
import { createAppContainer } from 'react-navigation';

...

const Nav = createStackNavigator({...});
export default createAppContainer(Nav);

package.json

{
  "dependencies": {
    "color": "3.1.2",
    "lodash": "4.17.15",
    "react-navigation": "4.2.2",
    "native-base": "2.13.8",
    "react-navigation-stack": "2.2.3",
    "@react-native-community/masked-view": "0.1.1",
    "react-native-gesture-handler": "1.5.0",
    "react-native-safe-area-context": "0.6.0",
    "react-native-screens": "2.0.0-alpha.20"
  }
}

Error Message

Request failed with status 403: 
  Evaluating module://react-native-screens.js
  Evaluating module://react-navigation-stack.js
  Evaluating module://src/nav/Nav.js.js
  Evaluating module://App.js.js
  Loading module://App.js
Error: Request failed with status 403: 
    at Object.eval (module://react-native-screens.js!transpiled:1:113)
    at eval (module://react-native-screens.js!transpiled:2:4)
    at eval (module://react-native-screens.js!transpiled:3:3)
    at eval (<anonymous>)
    at [snack internals]
    at Object.n ([snack internals]
    at e.evaluate ([snack internals]
    at He ([snack internals]
    at [snack internals]
    at https://snack.expo.io/web-player/36/static/js/app.34240727.chunk.js:1:15674

I've looked on the paths of react-native-screens.js, but I found nothing special. But one thing suspicious is that the version of react-native-screens has changed several times. Unfortunately, I don't remember what it was 2 days ago, when it was working fine, and yesterday it was different, and today it changed again.

I also tried to change react-navigation-stack version to 2.1.1, which was working fine, but no luck...

I'm so sorry that this is such a vague question,

Thank you.

2 Answers

I still don't find solution, but somehow, I found a way to cope with this problem.

Switch the version of expo to v35.0.0, and then use the below version of each library.

"react-navigation": "^4.2.2",
"react-native-screens": "^2.0.0-beta.2",
"react-navigation-stack": "2.1.1",
"react-native-gesture-handler": "^1.5.6",
"react-native-safe-area-context": "^0.7.2",
"@react-native-community/masked-view": "^0.1.1"

I still don't understand why it didn't work, and why it works now. If someone know why and how to use in Expo v36.0.0, please post your answer.

And @vanion, sorry I don't know how to mention you or contact you, but I hope you find this, and it will help you solve the issue.

Thank you.

I am not sure what is the cause of this issue but it seems like they have removed the react-native-screens from the react-navigation. So, to fix this you can simply install the react-native-screens(third party module) into your project.

To install the package from npm run this command into your project folder,

npm install --save react-native-screens@2.0.0-beta.2
Related