Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[error] react-native 0.60.0 react-navigation 3.11 with error: package android.support.v4.util doesn't exist #6066

Closed
M1seRy opened this issue Jul 10, 2019 · 20 comments

Comments

@M1seRy
Copy link

commented Jul 10, 2019

react-native-gesture-handler error

Hi,
I follow the instruction by the react-navigation website : https://reactnavigation.org/docs/en/getting-started.html to add react-navigation:

yarn add react-navigation

yarn add react-native-gesture-handler

react-native link react-native-gesture-handler

and successfully linked

info Linking "react-native-gesture-handler" iOS dependency info iOS module "react-native-gesture-handler" has been successfully linked info Linking "react-native-gesture-handler" Android dependency info Android module "react-native-gesture-handler" has been successfully linked

and then change the MainActivity.java like the docs it asks.

everything runs fine before adding navigation.

Then run react-native run-android emulator, and error pop up :

xxxx/node_modules/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerEvent.java:3: error: package android.support.v4.util doesn't exist import android.support.v4.util.Pools; ^ xxxx/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerEvent.java:19: error: package Pools doesn't exist private static final Pools.SynchronizedPool<RNGestureHandlerEvent> EVENTS_POOL = ^

Your Environment

software version
react-navigation ^3.11.0
react-native 0.60.0
node v10.14.1
npm or yarn npm 6.4.1 yarn 1.16.0
react-native-gesture-handler ^1.3.0

I try to solve this by search in issues and stackoverflow, but non of them is working for me.
Any advice or help is needed . Thx.

@KaviduAloka

This comment has been minimized.

Copy link

commented Jul 10, 2019

Same thing happened after being upgraded to React-Native 0.60.

To solve @M1seRy case, try replacing the package "android.support.v4" to "androidx.core". It might fix.

@KaviduAloka

This comment has been minimized.

Copy link

commented Jul 10, 2019

And I'm having this issue.
error: package com.swmansion.gesturehandler.react does not exist
Any solutions?

@jayan2019

This comment has been minimized.

Copy link

commented Jul 10, 2019

@KaviduAloka Manual linking of react-native-gesture-handler will resolve this issue.

@KaviduAloka

This comment has been minimized.

Copy link

commented Jul 10, 2019

@KaviduAloka Manual linking of react-native-gesture-handler will resolve this issue.

I tried and still didn't work. As RN 0.60 doesn't allow manual linking. And I did follow the steps by creating react-native.config.js to disable auto-linking. Still didn't work. Is there anyway to use React-native-navigation in RN 0.60?

@M1seRy

This comment has been minimized.

Copy link
Author

commented Jul 10, 2019

@KaviduAloka Hi, I solve this issue with 'rm -rf node_modules' and reinstall with yarn. before you link the package, just add a react-native.config.js file in project root path with the following content:

module.exports = { dependencies: { 'react-native-gesture-handler': { platforms: { android: null, ios: null, }, }, }, };

Then link it with react-native link react-native-gesture-handler and use jetifier with:

npm i jetifier
npx jetify

Rebuild, And It was been build successful.

But A another error out with react-native-gesture-handler package:

IMG RNGestHandlerModule null error =>

null is not an object (evaluating 'rngesturehandlermodule.default.createGestureHandler')

@KaviduAloka

This comment has been minimized.

Copy link

commented Jul 10, 2019

@M1seRy, yes that was fixed and the mentioned error appeared for me too...

@KaviduAloka

This comment has been minimized.

Copy link

commented Jul 10, 2019

@KaviduAloka Hi, I solve this issue with 'rm -rf node_modules' and reinstall with yarn. before you link the package, just add a react-native.config.js file in project root path with the following content:
module.exports = { dependencies: { 'react-native-gesture-handler': { platforms: { android: null, ios: null, }, }, }, };
Then link it with react-native link react-native-gesture-handler and use jetifier with:
npm i jetifier
npx jetify
Rebuild, And It was been build successful.
But A another error out with react-native-gesture-handler package:
IMG RNGestHandlerModule null error =>
null is not an object (evaluating 'rngesturehandlermodule.default.createGestureHandler')

You can fix this by commenting the export { default as Directions } from './Directions'; line in node_modules/react-native-gesture-handler/GestureHandler.js

And another error appears... :/

@techragesh

This comment has been minimized.

Copy link

commented Jul 10, 2019

I'm also having this issue.
error: package com.swmansion.gesturehandler.react does not exist
Any ideas?

@techragesh

This comment has been minimized.

Copy link

commented Jul 10, 2019

I am getting this error
MainActivity.java:6: error: package com.swmansion.gesturehandler.react does not exist
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;
MainActivity.java:24: error: cannot find symbol
return new RNGestureHandlerEnabledRootView(MainActivity.this);
symbol: class RNGestureHandlerEnabledRootView
2 errors

@KaviduAloka

This comment has been minimized.

Copy link

commented Jul 10, 2019

It seems react-navigation is not compatible with new ReactNative 0.60 in some points... You can easily workout if you create the project with the react-native version 0.59

@jivtesh813

This comment has been minimized.

Copy link

commented Jul 10, 2019

Any update from anyone, I am also getting error: package com.swmansion.gesturehandler.react does not exist.
I tried all the methods mentioned in different forums, such as
npm i jetifier
npx jetify
but nothing is working, I am still getting same error. If react-navigation is not compatible with 0.60, then could someone suggest alternative library?

@M1seRy

This comment has been minimized.

Copy link
Author

commented Jul 10, 2019

@techragesh Hi, I have got the same error. I hope this can make helps:
try to add this line in your project file android/app/build.gradle . under the dependencies block:

implementation project(':react-native-gesture-handler')

build.gradle example:

dependencies {
    implementation project(':react-native-gesture-handler')
    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation "com.facebook.react:react-native:+"  // From node_modules
    implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"

    // JSC from node_modules
    if (useIntlJsc) {
        implementation 'org.webkit:android-jsc-intl:+'
    } else {
        implementation 'org.webkit:android-jsc:+'
    }
}

add this 2 line code to settings.gradle file in android/settings.gradle:

include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')

settings.gradle example:

rootProject.name = 'yourProject'
include ':react-native-gesture-handler'
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-gesture-handler/android')
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'

then:

  1. delete the 'build' fold in your project 'android/app/build'
  2. clean the watchman file: watchman watch-del-all
  3. restart metro bundler server: react-native start --reset-cache
  4. rebuild react-native run-android

good luck.

@jivtesh813

This comment has been minimized.

Copy link

commented Jul 10, 2019

@M1seRy - I followed your instructions and didn't get previous error (error: package com.swmansion.gesturehandler.react does not exist), but now I am getting below error.

error: package android.support.v4.util does not exist

Any more help you can offer?

@FerBiani

This comment has been minimized.

Copy link

commented Jul 11, 2019

Hi! I followed the instructions in this tutorial and the problems were solved: https://youtu.be/NcQhDlC7hT8

I hope it helps!

@satya164

This comment has been minimized.

Copy link
Member

commented Jul 11, 2019

Please check the latest docs: https://reactnavigation.org/docs/en/getting-started.html

@satya164 satya164 closed this Jul 11, 2019

@jivtesh813

This comment has been minimized.

Copy link

commented Jul 11, 2019

@satya164 I know you closed the issue, and to be honest the video https://youtu.be/NcQhDlC7hT8 worked for me, and can see you have updated the official documentation. But we still don't need to change MainActivity.java file. That step was not in video, and I didn't did yet, and everything is working good for me.

I have written all the steps for my help. But I am pasting here, so that it can help everyone.

Steps to create React-Native app with React-Navigation

  1. Create React Native app with below command. It is better if you open cmd as administrator, as one of the below jetifier commands might request that.

react-native init AwesomeProject

  1. Go into project by:
    cd AwesomeProject

Note - All commands in below steps will be run from this project location

  1. Install React Navigation and its handler by below 2 commands:

npm install --save react-navigation

npm install --save react-native-gesture-handler

  1. I have not followed next steps from React Navigation website, instead followed below steps

Unlink for iOS with below command:
react-native unlink react-native-gesture-handler --platforms iOS

Although it did nothing and i got the message below, which is ok.
info iOS module "react-native-gesture-handler" is not installed

  1. Create a file named react-native.config.js in the root directory of your project. Means in this case it will be under folder AwesomeProject, and this file will be adjacent to other files such as - package.json etc

Add below code to the react-native.config.js file
module.exports = {
dependencies: {
'react-native-gesture-handler': {
platforms: {
ios: null,
},
},
},
};

  1. After saving above file, run below command:
    npm install --save-dev jetifier

  2. Now go to project’s package.json file and add below code in Scripts section and save:
    "postinstall": "npx jetify"

Your package.json, should look like below:
"name": "AwesomeProject",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "react-native start",
"test": "jest",
"lint": "eslint .",
"postinstall": "npx jetify"
},

  1. Now run below command:
    npm install

    You should see something like this on console:
    Jetifier found 893 file(s) to forward-jetify. Using 4 workers…

  2. Update the MainActivity.java file, as mentioned in ReactNavigation official site.

  3. Now let’s test if React Navigation working. Add below code to your App.js

import React from "react";
import { View, Text } from "react-native";
import { createStackNavigator, createAppContainer } from "react-navigation";

class HomeScreen extends React.Component {
render() {
return (
<View style={{ flex: 1, alignItems: "center", justifyContent: "center" }}>
Home Screen

);
}
}

const AppNavigator = createStackNavigator({
Home: {
screen: HomeScreen
}
});

export default createAppContainer(AppNavigator);

  1. Run below command:
    react-native run-android

  2. It should run ok, but I got below error:
    error: bundling failed: Error: Unable to resolve module ./createNavigationContainer

  3. If you get above error as well, then delete all files from %TEMP% folder. OR you can use below command to clear cache.
    react-native start --reset-cache

For me clearing %TEMP% folder works.

GOOD LUCK!

@tindn

This comment has been minimized.

Copy link

commented Jul 18, 2019

@jivtesh813 I have the same errors with RN 0.60.3, react-navigation 3.11.1 and react-native-gesture-handler 1.3.0. Following your steps (and not updating MainActivity.java) resolves this. @satya164 should the guide be updated to this? I can submit a PR for it too.

@satya164

This comment has been minimized.

Copy link
Member

commented Jul 18, 2019

I'm 100% sure MainActivity.java needs to be updated for gestures to work. Regarding build errors, make sure you're on latest React Native version. If it doesn't work, use https://github.com/mikehardy/jetifier

@tindn

This comment has been minimized.

Copy link

commented Jul 18, 2019

That's good to know. Will modify the MainActivity.java. I am on the latest RN version, wonder why it doesn't work for me. Jetifier fixes it though.

@jivtesh813

This comment has been minimized.

Copy link

commented Jul 18, 2019

@tindn @satya164 - I have updated my steps and added to update MainActivity.java file as well as per the official documentation. I did received few random error before that, so I though it might be because I haven't updated MainActivity.java. So I updated that, so far so good. So updated my steps as well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
8 participants
You can’t perform that action at this time.