I'm learning react native navigation from https://reactnavigation.org/docs/hello-react-navigation
This is my package.json:
{
"name": "ReactNativeNavigation",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
"lint": "eslint ."
},
"dependencies": {
"@react-native-community/masked-view": "^0.1.10",
"@react-navigation/native": "^5.5.1",
"@react-navigation/stack": "^5.4.2",
"react": "16.11.0",
"react-native": "0.62.2",
"react-native-gesture-handler": "^1.6.1",
"react-native-reanimated": "^1.9.0",
"react-native-safe-area-context": "^3.0.2",
"react-native-screens": "^2.8.0"
},
"devDependencies": {
"@babel/core": "^7.10.2",
"@babel/runtime": "^7.10.2",
"@react-native-community/eslint-config": "^1.1.0",
"babel-jest": "^26.0.1",
"eslint": "^7.2.0",
"jest": "^26.0.1",
"metro-react-native-babel-preset": "^0.59.0",
"react-test-renderer": "16.11.0"
},
"jest": {
"preset": "react-native"
}
}This is App.js:
Just copied the code
import * as React from 'react';
import { View, Text } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
function HomeScreen() {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text>Home Screen</Text>
</View>
);
}
const Stack = createStackNavigator();
function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen name="Home" component={HomeScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}
export default App;When I run "react-native run-android",it doesn't work properly.
The screenshots is: enter image description here
And error info in command prompt is:
Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.0.1/userguide/command_line_interface.html#sec:command_line_warnings
FAILURE: Build failed with an exception.
* What went wrong:
A problem occurred configuring project ':react-native-screens'.
> Could not resolve all artifacts for configuration ':react-native-screens:classpath'.
> Could not resolve com.android.tools.build:gradle:3.3.1.
Required by:
project :react-native-screens
> Could not resolve com.android.tools.build:gradle:3.3.1.
> Could not get resource 'https://dl.google.com/dl/android/maven2/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'.
> Could not GET 'https://dl.google.com/dl/android/maven2/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'. Received status code 400 from server: Bad Request
> Could not resolve com.android.tools.build:gradle:3.3.1.
> Could not get resource 'https://jcenter.bintray.com/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'.
> Could not GET 'https://jcenter.bintray.com/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'. Received status code 400 from server: Bad Request
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 26s
error Failed to install the app. Make sure you have the Android development environment set up: https://reactnative.dev/docs/environment-setup. Run CLI with --verbose flag for more details.
Error: Command failed: gradlew.bat app:installDebug -PreactNativeDevServerPort=8081
FAILURE: Build failed with an exception.
* What went wrong:
A problem occurred configuring project ':react-native-screens'.
> Could not resolve all artifacts for configuration ':react-native-screens:classpath'.
> Could not resolve com.android.tools.build:gradle:3.3.1.
Required by:
project :react-native-screens
> Could not resolve com.android.tools.build:gradle:3.3.1.
> Could not get resource 'https://dl.google.com/dl/android/maven2/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'.
> Could not GET 'https://dl.google.com/dl/android/maven2/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'. Received status code 400 from server: Bad Request
> Could not resolve com.android.tools.build:gradle:3.3.1.
> Could not get resource 'https://jcenter.bintray.com/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'.
> Could not GET 'https://jcenter.bintray.com/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'. Received status code 400 from server: Bad Request
* Try:
Run with --stacktrace option to get the stack trace. Run with --info or --debug option to get more log output. Run with --scan to get full insights.
* Get more help at https://help.gradle.org
BUILD FAILED in 26s
at makeError (E:\learn\ReactNative\ReactNativeNavigation\node_modules\execa\index.js:174:9)
at E:\learn\ReactNative\ReactNativeNavigation\node_modules\execa\index.js:278:16
at processTicksAndRejections (internal/process/task_queues.js:97:5)
at async runOnAllDevices (E:\learn\ReactNative\ReactNativeNavigation\node_modules\@react-native-community\cli-platform-android\build\commands\runAndroid\runOnAllDevices.js:94:5)
at async Command.handleAction (E:\learn\ReactNative\ReactNativeNavigation\node_modules\react-native\node_modules\@react-native-community\cli\build\index.js:186:9)(I paste the code into "Code Snippet" in order to keep the code display normal,I used the stackovflow the first time)
What should I do to solve these problems?
In fact,the demo below is still not working:
import 'react-native-gesture-handler';
import * as React from 'react';
import { NavigationContainer } from '@react-navigation/native';
export default function App() {
return (
<NavigationContainer>{/* Rest of your app code */}</NavigationContainer>
);
}When I comment out this line of code "import 'react-native-gesture-handler';" It works!
I sincerely look forward to your help!
