null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')

Question

null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')

Closed this issue 4 years ago · 105 comments

I'm having this issue in Android with react-nagivation and react-native-gesture-handler latest release. kindly help

Answer 1 · 2019-07-09T00:35:15.000Z

please tell solution for android windows.

On Mon, 8 Jul 2019, 3:54 p.m. Yasir KAVRAŞ, ***@***.***> wrote: Hello, 1 - yarn add react-navigation 2 - yarn add react-native-gesture-handler 3 - cd ios/ 4 - pod install 5 - cd .. 6 - react-native run-ios and react-native run-android — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#676>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ALAPVJHCAPBRJGN37JN7MKDP6MME5ANCNFSM4H6XUVLQ> .

Answer 2 · 2019-07-09T08:09:22.000Z

I have the same questions.

Answer 3 · 2019-07-09T08:18:16.000Z

In 0.60, this is an awful bug. Please solve it as soon as possible.

Answer 4 · 2019-07-09T13:07:22.000Z

pod install on ios folder works for me

cd ios
pod install

Answer 5 · 2019-07-09T13:54:09.000Z

This worked. Thanks, @har2008preet! 🚀

pod install on ios folder works for me
cd ios
pod install

Answer 6 · 2019-07-10T00:47:12.000Z

How resolve it on Android and Window system.

Answer 7 · 2019-07-10T00:58:26.000Z

it works well in iOS, but still fail to run in Android. Who can tell me how to solve the bug in Android?

Answer 8 · 2019-07-10T01:58:34.000Z

I run my app on Android successfully with react-native-gesture-handler

I disable autoliking
Using jetify to fix Android X in this time.

Answer 9 · 2019-07-10T03:10:14.000Z

@dangtienngoc , can you help how to use jetify to fix android X?

Answer 10 · 2019-07-10T04:38:31.000Z

@dangtienngoc , can you help how to use jetify to fix android X?

You can check it here: https://github.com/mikehardy/jetifier

Answer 11 · 2019-07-10T05:20:04.000Z

@MrHazimAli I do a video my step resolve issue here:

For Android: https://youtu.be/NcQhDlC7hT8
For IOS:
-- cd ios
-- pod install

Answer 12 · 2019-07-10T07:31:11.000Z

thanks @dangtienngoc , working!

Answer 13 · 2019-07-10T08:08:04.000Z

thanks @dangtienngoc , it works!!!!

Answer 14 · 2019-07-10T09:15:20.000Z

many thanks for your video. @dangtienngoc , I use jetifier It was been build successful.
A anoter error in emulator :
TypeError: null is not an object (evaluating '_RNGestureHandlerModule.default.createGestureHandler') This error is located at in PanGestureHandler (at StackViewLayout.tsx:372)
Any solutions?

Answer 15 · 2019-07-10T09:41:32.000Z

In react-native@0.59.10 it doesn't work. I still get the same error, even after jetify "null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')"

Answer 16 · 2019-07-10T12:12:47.000Z

@meraklis56 try to commenting this line:

// export { default as Directions } from './Directions';

in the your project -> node_modules -> react-native-gesture-handler -> GestureHandler.js

Good luck.

Answer 17 · 2019-07-10T14:22:16.000Z

Now the error is:

07-10 16:20:38.993 16011 16348 E ReactNativeJS: null is not an object (evaluating '_RNGestureHandlerModule.default.handleSetJSResponder')
07-10 16:20:39.067 16011 16348 E ReactNativeJS: null is not an object (evaluating '_RNGestureHandlerModule.default.handleClearJSResponder')

Answer 18 · 2019-07-10T14:57:39.000Z

In react-native@0.59.10 it doesn't work. I still get the same error, even after jetify "null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')"

react-native@0.59.10 not support android X yet, check your react native cli

^2.0.0 => ^0.60.0
^1.0.0 => ^0.59.0

Because react native cli ^2.0.0 support auto linking module

Answer 19 · 2019-07-10T16:20:12.000Z

In react-native@0.59.10 it doesn't work. I still get the same error, even after jetify "null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')"

Remove this modification: // export { default as Directions } from './Directions';

And if you specified something in your "react-native.config.js", remove it.

add these lines in your MainActivity.java:
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

And add this inside the MainActivity class, just after protected String getMainComponentName() function
@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}

And after that do:
cd android
gradlew clean
cd ..

Then do the usual: react-native run-android, and give me the output.
Good luck.

Answer 20 · 2019-07-10T22:20:57.000Z

please check your MainApplication.java
with react-native 0.60 looks like:

@Override
protected List<ReactPackage> getPackages() {
      @SuppressWarnings("UnnecessaryLocalVariable")
      List<ReactPackage> packages = new PackageList(this).getPackages();
      return packages;
}

if you do not use Autolink function this package will not added try to add

... 
List<ReactPackage> packages = new PackageList(this).getPackages();
packages.add(new RNGestureHandlerPackage() );
return packages

and don't forget the import
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;

Please give feedback if it works

Answer 21 · 2019-07-11T04:17:40.000Z

I installed the new version yesterday, using this

show. same error ,it is not good to follow the method provided below and keep reporting errors. who can help me ?thinksyou waiting for this , dependencies: "dependencies": { "react": "16.8.6", "react-native": "0.60.0", "react-native-gesture-handler": "^1.3.0", "react-navigation": "^3.11.0" },

Answer 22 · 2019-07-11T04:20:22.000Z

Has this problem been solved? I made the same mistake as ios.

Answer 23 · 2019-07-11T07:38:50.000Z

@GeronimoKTT

In react-native@0.59.10 it doesn't work. I still get the same error, even after jetify "null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')"

Remove this modification: // export { default as Directions } from './Directions';

And if you specified something in your "react-native.config.js", remove it.

add these lines in your MainActivity.java:
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

And add this inside the MainActivity class, just after protected String getMainComponentName() function
@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}

And after that do:
cd android
gradlew clean
cd ..

Then do the usual: react-native run-android, and give me the output.
Good luck.

I failed to mention that I am using React-Native-Navigation thus, according to installing guides I should ignore those steps and wrap every screen component using gestureHandlerRootHOC on the JS side, instead. The moment I am just importing the react-native-gesture-handler, i get the aforementioned error.

Answer 24 · 2019-07-11T11:29:41.000Z

Ok, which version of react-native-gesture-handler are you using?

Answer 25 · 2019-07-11T12:56:20.000Z

"react": "^16.8.6",
"react-native": "^0.59.10",
"react-native-gesture-handler": "^1.3.0"

Answer 26 · 2019-07-11T14:56:38.000Z

Ok, can I have a look to your MainApplication.java, build.gradle (from app/) and your react-native.config.js (if you have one)

Answer 27 · 2019-07-11T17:47:04.000Z

Finally, I quit React Native. Either you can waste your time fixing bugs or you can make your project, it's on your luck.

Answer 28 · 2019-07-11T17:48:44.000Z

Facebook should spare some time on fixing RN for windows, not everyone uses a mac.

Answer 29 · 2019-07-11T17:48:52.000Z

For iOS I had to manually add this to the Podfile pod 'RNGestureHandler', :podspec => '../node_modules/react-native-gesture-handler/RNGestureHandler.podspec' and then run pod install for it to work

Answer 30 · 2019-07-11T21:23:32.000Z

Running react-native unlink react-native-gesture-handler plus what @GeronimoKTT suggested is the only thing that worked for me on Android (React Native 0.60)

My woes were caused by following the installation instructions of React Navigation which seem to be outdated for RN 0.60

Answer 31 · 2019-07-12T07:29:40.000Z

@GeronimoKTT

MainApplication.java

`import android.app.Application;

import com.projectseptember.RNGL.RNGLPackage;
import com.arthenica.reactnative.RNFFmpegPackage;
import com.facebook.react.ReactApplication;
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.reactnativecommunity.slider.ReactSliderPackage;
import com.rnfs.RNFSPackage;
import com.imagepicker.ImagePickerPackage;
import com.horcrux.svg.SvgPackage;
import com.BV.LinearGradient.LinearGradientPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import com.reactnativecommunity.slider.ReactSliderPackage;

import com.reactnativenavigation.NavigationApplication;
import com.reactnativenavigation.react.NavigationReactNativeHost;
import com.reactnativenavigation.react.ReactGateway;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends NavigationApplication {

@Override
protected ReactGateway createReactGateway() {
    ReactNativeHost host = new NavigationReactNativeHost(this, isDebug(), createAdditionalReactPackages()) {
        @Override
        protected String getJSMainModuleName() {
            return "index";
        }
    };
    return new ReactGateway(this, isDebug(), host);
}

@Override
public boolean isDebug() {
    return BuildConfig.DEBUG;
}

protected List<ReactPackage> getPackages() {
    // Add additional packages you require here
    // No need to add RnnPackage and MainReactPackage
    return Arrays.<ReactPackage>asList(
                new SvgPackage(),
                new LinearGradientPackage(),
                new ImagePickerPackage(),
                new RNFSPackage(),
                new RNFFmpegPackage(),
                new RNGLPackage(),
                new ReactSliderPackage()
        // eg. new VectorIconsPackage()
    );
}

@Override
public List<ReactPackage> createAdditionalReactPackages() {
    return getPackages();
}

}`

build.grade

`def enableProguardInReleaseBuilds = false

android {
compileSdkVersion rootProject.ext.compileSdkVersion

compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
}

defaultConfig {
    applicationId "com.momus2"
    minSdkVersion rootProject.ext.minSdkVersion
    targetSdkVersion rootProject.ext.targetSdkVersion
    missingDimensionStrategy "RNN.reactNativeVersion", "reactNative57_5"
    versionCode 1
    versionName "1.0"
    ndk {
          abiFilters "armeabi-v7a", "arm64-v8a", "x86", "x86_64"
        }
}
splits {
    abi {
        reset()
        enable enableSeparateBuildPerCPUArchitecture
        universalApk false  // If true, also generate a universal APK
        include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
    }
}

packagingOptions {
        pickFirst 'lib/x86/libc++_shared.so'
        pickFirst 'lib/x86_64/libc++_shared.so'
        pickFirst 'lib/armeabi-v7a/libc++_shared.so'
        pickFirst 'lib/arm64-v8a/libc++_shared.so'
    }
buildTypes {
    release {
        minifyEnabled enableProguardInReleaseBuilds
        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
    }
}
// applicationVariants are e.g. debug, release
applicationVariants.all { variant ->
    variant.outputs.each { output ->
        // For each separate APK per architecture, set a unique version code as described here:
        // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
        def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
        def abi = output.getFilter(OutputFile.ABI)
        if (abi != null) {  // null for the universal-debug, universal-release variants
            output.versionCodeOverride =
                    versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
        }
    }
}

}

dependencies {
implementation project(':react-native-gesture-handler')
implementation project(':@react-native-community_slider')
compile project(':RNGL')
implementation project(':react-native-ffmpeg')
implementation project(':react-native-fs')
implementation project(':react-native-image-picker')
implementation project(':react-native-svg')
implementation project(':react-native-linear-gradient')
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation 'androidx.appcompat:appcompat:1.0.0'
implementation "com.facebook.react:react-native:+" // From node_modules
implementation project(':react-native-svg')
implementation project(':react-native-navigation')
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
from configurations.compile
into 'libs'
}
`

Regarding react-native.config.js, I tried with settings and without:

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

Answer 32 · 2019-07-12T08:51:15.000Z

please check your MainApplication.java
with react-native 0.60 looks like:
@Override
protected List<ReactPackage> getPackages() {
      @SuppressWarnings("UnnecessaryLocalVariable")
      List<ReactPackage> packages = new PackageList(this).getPackages();
      return packages;
}
if you do not use Autolink function this package will not added try to add
... 
List<ReactPackage> packages = new PackageList(this).getPackages();
packages.add(new RNGestureHandlerPackage() );
return packages
and don't forget the import
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;

Please give feedback if it works

this's the only right way
it's wasted me two days ...

Answer 33 · 2019-07-12T10:10:58.000Z

...
Using Protobuf (3.8.0)
Installing RNGestureHandler (1.3.0)
Installing React (0.11.0)
Using gRPC-C++ (0.0.9)
Using gRPC-Core (1.21.0)
Using leveldb-library (1.20)
Using nanopb (0.3.901)
Generating Pods project
Integrating client project
Sending stats
Pod installation complete! There are 13 dependencies from the Podfile and 30 total pods installed.

[!] React has been deprecated

Guys, when I link this
react-native link react-native-gesture-handler
and then make
pod install

it installs React also , and then says its deprecated.. and finally gives an error
`null is not an object (evaluating '_RNGestureHandlerModule.default.Direction')

Answer 34 · 2019-07-12T10:19:41.000Z

This work for me.

yarn add react-navigation
yarn add react-native-gesture-handler
react-native link react-native-gesture-handler
add react-native.config.js file in the root of project
module.exports = { dependencies: { 'react-native-gesture-handler': { platforms: { android: null, ios: null, }, }, }, };
cd ios
pod install

"react-native": "0.60.3"
"react-navigation": "^3.11.0"
"react-native-gesture-handler": "^1.3.0"

Answer 35 · 2019-07-12T10:35:41.000Z

"dependencies": {
"react": "16.8.3",
"react-native": "0.59.9",
"react-native-firebase": "^5.5.4",
"react-navigation": "^3.11.0"
},

I have this setup.
and whatever I do, I get far more errors.
This is a real nightmare...

I use this repo, just want to add navigation, and I just struggle for two days.
https://github.com/invertase/react-native-firebase-starter

Answer 36 · 2019-07-12T11:00:23.000Z

"dependencies": {
"react": "16.8.3",
"react-native": "0.59.9",
"react-native-firebase": "^5.5.4",
"react-navigation": "^3.11.0"
},

I have this setup.
and whatever I do, I get far more errors.
This is a real nightmare...

I use this repo, just want to add navigation, and I just struggle for two days.
https://github.com/invertase/react-native-firebase-starter

install react-native-gesture-handler

yarn add react-native-gesture-handler

Answer 37 · 2019-07-12T11:05:47.000Z

"dependencies": {
"react": "16.8.3",
"react-native": "0.59.9",
"react-native-firebase": "^5.5.4",
"react-navigation": "^3.11.0"
},
I have this setup.
and whatever I do, I get far more errors.
This is a real nightmare...
I use this repo, just want to add navigation, and I just struggle for two days.
https://github.com/invertase/react-native-firebase-starter

install react-native-gesture-handler

yarn add react-native-gesture-handler

I've done that, but after I do
pod install

it installs React also , and then says its deprecated.. and finally gives an error
`null is not an object (evaluating '_RNGestureHandlerModule.default.Direction')

Answer 38 · 2019-07-12T12:53:24.000Z

@GeronimoKTT
In my case, on RN 0.60.0, the fix was to erase everything inside of react-native.config.js.

Answer 39 · 2019-07-13T11:24:56.000Z

it works for me, thanks @har2008preet

Answer 40 · 2019-07-16T21:39:51.000Z

@MrHazimAli I do a video my step resolve issue here:

https://youtu.be/NcQhDlC7hT8

Thank you bro.
Ps: ReactNative guys needs to resolve this ASAP.

Answer 41 · 2019-07-18T09:57:50.000Z

@GeronimoKTT

MainApplication.java

`import android.app.Application;

import com.projectseptember.RNGL.RNGLPackage;
import com.arthenica.reactnative.RNFFmpegPackage;
import com.facebook.react.ReactApplication;
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.reactnativecommunity.slider.ReactSliderPackage;
import com.rnfs.RNFSPackage;
import com.imagepicker.ImagePickerPackage;
import com.horcrux.svg.SvgPackage;
import com.BV.LinearGradient.LinearGradientPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import com.reactnativecommunity.slider.ReactSliderPackage;

import com.reactnativenavigation.NavigationApplication;
import com.reactnativenavigation.react.NavigationReactNativeHost;
import com.reactnativenavigation.react.ReactGateway;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends NavigationApplication {
@Override
protected ReactGateway createReactGateway() {
    ReactNativeHost host = new NavigationReactNativeHost(this, isDebug(), createAdditionalReactPackages()) {
        @Override
        protected String getJSMainModuleName() {
            return "index";
        }
    };
    return new ReactGateway(this, isDebug(), host);
}

@Override
public boolean isDebug() {
    return BuildConfig.DEBUG;
}

protected List<ReactPackage> getPackages() {
    // Add additional packages you require here
    // No need to add RnnPackage and MainReactPackage
    return Arrays.<ReactPackage>asList(
                new SvgPackage(),
                new LinearGradientPackage(),
                new ImagePickerPackage(),
                new RNFSPackage(),
                new RNFFmpegPackage(),
                new RNGLPackage(),
                new ReactSliderPackage()
        // eg. new VectorIconsPackage()
    );
}

@Override
public List<ReactPackage> createAdditionalReactPackages() {
    return getPackages();
}
}`

build.grade

`def enableProguardInReleaseBuilds = false

android {
compileSdkVersion rootProject.ext.compileSdkVersion
compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
}

defaultConfig {
    applicationId "com.momus2"
    minSdkVersion rootProject.ext.minSdkVersion
    targetSdkVersion rootProject.ext.targetSdkVersion
    missingDimensionStrategy "RNN.reactNativeVersion", "reactNative57_5"
    versionCode 1
    versionName "1.0"
    ndk {
          abiFilters "armeabi-v7a", "arm64-v8a", "x86", "x86_64"
        }
}
splits {
    abi {
        reset()
        enable enableSeparateBuildPerCPUArchitecture
        universalApk false  // If true, also generate a universal APK
        include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
    }
}

packagingOptions {
        pickFirst 'lib/x86/libc++_shared.so'
        pickFirst 'lib/x86_64/libc++_shared.so'
        pickFirst 'lib/armeabi-v7a/libc++_shared.so'
        pickFirst 'lib/arm64-v8a/libc++_shared.so'
    }
buildTypes {
    release {
        minifyEnabled enableProguardInReleaseBuilds
        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
    }
}
// applicationVariants are e.g. debug, release
applicationVariants.all { variant ->
    variant.outputs.each { output ->
        // For each separate APK per architecture, set a unique version code as described here:
        // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
        def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
        def abi = output.getFilter(OutputFile.ABI)
        if (abi != null) {  // null for the universal-debug, universal-release variants
            output.versionCodeOverride =
                    versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
        }
    }
}
}

dependencies {
implementation project(':react-native-gesture-handler')
implementation project(':@react-native-community_slider')
compile project(':RNGL')
implementation project(':react-native-ffmpeg')
implementation project(':react-native-fs')
implementation project(':react-native-image-picker')
implementation project(':react-native-svg')
implementation project(':react-native-linear-gradient')
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation 'androidx.appcompat:appcompat:1.0.0'
implementation "com.facebook.react:react-native:+" // From node_modules
implementation project(':react-native-svg')
implementation project(':react-native-navigation')
}

// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
from configurations.compile
into 'libs'
}
`

Regarding react-native.config.js, I tried with settings and without:

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

Sorry for the very late response.
try adding this line ,new RNGestureHandlerPackage() inside protected List<ReactPackage> getPackages(), right after new ReactSliderPackage()

And give me the output.

Answer 42 · 2019-08-02T07:37:25.000Z

just got this error on rn 0.60.4 and fixed by manual link

$ yarn add react-navigation
$ yarn add react-native-gesture-handler react-native-reanimated
$ react-native link react-native-reanimated
$ react-native link react-native-gesture-handler

ios:

$ cd ios && pod install && cd ..

android:
please follow the steps on the documentation, edit MainActivity.java

import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

// ...

@Override
protected ReactActivityDelegate createReactActivityDelegate() {
    return new ReactActivityDelegate(this, getMainComponentName()) {
        @Override
        protected ReactRootView createRootView() {
            return new RNGestureHandlerEnabledRootView(MainActivity.this);
        }
    };
}

and make sure MainApplication.java already import reanimated and getsure handler

import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.swmansion.reanimated.ReanimatedPackage;

then run your rn service with reset-cache param

$ react-native start --reset-cache

Answer 43 · 2019-08-02T10:19:52.000Z

I have got an error. I have to fix it on win 10.
null is not an object (evaluating 'rngesturehandlermodule.default.direction')

Answer 44 · 2019-08-02T10:24:07.000Z

Hi.ibunubi
I tried it. but I have got error yet.

Answer 45 · 2019-08-02T12:22:27.000Z

@bailer
For iOS I had to manually add this to the Podfile pod 'RNGestureHandler', :podspec => '../node_modules/react-native-gesture-handler/RNGestureHandler.podspec' and then run pod install for it to work

solved my question, nice

Answer 46 · 2019-08-04T05:40:16.000Z

@wangbing0417 this worked for me on RN 0.6.0

Answer 47 · 2019-08-08T18:09:41.000Z

@wangbing0417 thank you, this worked for me. RN 0.6.0 (iOS)

Answer 48 · 2019-08-26T01:32:05.000Z

In react-native@0.59.10 it doesn't work. I still get the same error, even after jetify "null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')"

react-native@0.59.10 not support android X yet, check your react native cli

^2.0.0 => ^0.60.0
^1.0.0 => ^0.59.0

Because react native cli ^2.0.0 support auto linking module

how to check react native cli version

Answer 49 · 2019-09-24T10:40:20.000Z

@ytt123 this command will give react-native cli version too

react-native -version

Answer 50 · 2019-10-05T14:38:46.000Z

for android:

install https://github.com/mikehardy/jetifier
npx jetify
for ios:

cd ios
pod install

This just worked for me very well ,with out stress..
Please follow the instruction well....it works
thank you Harpreet Singh har2008preet

Answer 51 · 2019-10-05T23:25:41.000Z

pod install on ios folder works for me
cd ios
pod install

For me too!

Answer 52 · 2019-10-11T23:12:52.000Z

On win 10 with version below still have the same error. Tried the suggested fix, cannot work.
react-native-cli: 2.0.1
react-native: 0.61.2
Anyone able to solve this in win 10?

Answer 53 · 2019-10-12T12:46:44.000Z

@har2008preet

pod install on ios folder works for me
cd ios
pod install

Worked for me, Thanks!

Answer 54 · 2019-10-18T16:51:44.000Z

react-native-cli: 2.0.1
react-native: 0.61.2

In my case this problem is with link, after link of the librarys cause the problem, i unlinked the library and solved, because in react-native > 0.61 the link is native, i don't know why

Answer 55 · 2019-10-25T15:35:29.000Z

pod install on ios folder works for me
cd ios
pod install

Worked for me as well.

react-native-cli: 2.0.1
react-native: 0.61.2

Answer 56 · 2019-11-10T06:28:06.000Z

@GeronimoKTT
MainApplication.java
`import android.app.Application;
import com.projectseptember.RNGL.RNGLPackage;
import com.arthenica.reactnative.RNFFmpegPackage;
import com.facebook.react.ReactApplication;
import com.swmansion.gesturehandler.react.RNGestureHandlerPackage;
import com.reactnativecommunity.slider.ReactSliderPackage;
import com.rnfs.RNFSPackage;
import com.imagepicker.ImagePickerPackage;
import com.horcrux.svg.SvgPackage;
import com.BV.LinearGradient.LinearGradientPackage;
import com.facebook.react.ReactNativeHost;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
import com.facebook.soloader.SoLoader;
import com.reactnativecommunity.slider.ReactSliderPackage;
import com.reactnativenavigation.NavigationApplication;
import com.reactnativenavigation.react.NavigationReactNativeHost;
import com.reactnativenavigation.react.ReactGateway;
import java.util.Arrays;
import java.util.List;
public class MainApplication extends NavigationApplication {
@Override
protected ReactGateway createReactGateway() {
    ReactNativeHost host = new NavigationReactNativeHost(this, isDebug(), createAdditionalReactPackages()) {
        @Override
        protected String getJSMainModuleName() {
            return "index";
        }
    };
    return new ReactGateway(this, isDebug(), host);
}

@Override
public boolean isDebug() {
    return BuildConfig.DEBUG;
}

protected List<ReactPackage> getPackages() {
    // Add additional packages you require here
    // No need to add RnnPackage and MainReactPackage
    return Arrays.<ReactPackage>asList(
                new SvgPackage(),
                new LinearGradientPackage(),
                new ImagePickerPackage(),
                new RNFSPackage(),
                new RNFFmpegPackage(),
                new RNGLPackage(),
                new ReactSliderPackage()
        // eg. new VectorIconsPackage()
    );
}

@Override
public List<ReactPackage> createAdditionalReactPackages() {
    return getPackages();
}
}build.gradedef enableProguardInReleaseBuilds = false
android {
compileSdkVersion rootProject.ext.compileSdkVersion
compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
}

defaultConfig {
    applicationId "com.momus2"
    minSdkVersion rootProject.ext.minSdkVersion
    targetSdkVersion rootProject.ext.targetSdkVersion
    missingDimensionStrategy "RNN.reactNativeVersion", "reactNative57_5"
    versionCode 1
    versionName "1.0"
    ndk {
          abiFilters "armeabi-v7a", "arm64-v8a", "x86", "x86_64"
        }
}
splits {
    abi {
        reset()
        enable enableSeparateBuildPerCPUArchitecture
        universalApk false  // If true, also generate a universal APK
        include "armeabi-v7a", "x86", "arm64-v8a", "x86_64"
    }
}

packagingOptions {
        pickFirst 'lib/x86/libc++_shared.so'
        pickFirst 'lib/x86_64/libc++_shared.so'
        pickFirst 'lib/armeabi-v7a/libc++_shared.so'
        pickFirst 'lib/arm64-v8a/libc++_shared.so'
    }
buildTypes {
    release {
        minifyEnabled enableProguardInReleaseBuilds
        proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
    }
}
// applicationVariants are e.g. debug, release
applicationVariants.all { variant ->
    variant.outputs.each { output ->
        // For each separate APK per architecture, set a unique version code as described here:
        // http://tools.android.com/tech-docs/new-build-system/user-guide/apk-splits
        def versionCodes = ["armeabi-v7a":1, "x86":2, "arm64-v8a": 3, "x86_64": 4]
        def abi = output.getFilter(OutputFile.ABI)
        if (abi != null) {  // null for the universal-debug, universal-release variants
            output.versionCodeOverride =
                    versionCodes.get(abi) * 1048576 + defaultConfig.versionCode
        }
    }
}
}
dependencies {
implementation project(':react-native-gesture-handler')
implementation project(':@react-native-community_slider')
compile project(':RNGL')
implementation project(':react-native-ffmpeg')
implementation project(':react-native-fs')
implementation project(':react-native-image-picker')
implementation project(':react-native-svg')
implementation project(':react-native-linear-gradient')
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation 'androidx.appcompat:appcompat:1.0.0'
implementation "com.facebook.react:react-native:+" // From node_modules
implementation project(':react-native-svg')
implementation project(':react-native-navigation')
}
// Run this once to be able to run the application with BUCK
// puts all compile dependencies into folder libs for BUCK to use
task copyDownloadableDepsToLibs(type: Copy) {
from configurations.compile
into 'libs'
}
Regarding react-native.config.js, I tried with settings and without:module.exports = { dependencies: { 'react-native-gesture-handler': { platforms: { ios: null, } } } }; `
Sorry for the very late response.
try adding this line ,new RNGestureHandlerPackage() inside protected List<ReactPackage> getPackages(), right after new ReactSliderPackage()

And give me the output.

this worked for me, using react-native-navigation too, thx

Answer 57 · 2019-11-14T06:01:10.000Z

I am using "react-native": "0.59.0"
I work on Ubuntu
I fixed the issue on my android 10 emulator by following the steps mentioned here

Make sure you follow steps for the version you are using (React Native 0.59 and lower in my case)

You might have to run a Gradle clean
I followed below steps for that:

cd /myproject/android
./gradlew clean
cd ..
react-native run-android

Good Luck!

Answer 58 · 2019-11-21T10:17:00.000Z

For iOS I had to manually add this to the Podfile pod 'RNGestureHandler', :podspec => '../node_modules/react-native-gesture-handler/RNGestureHandler.podspec' and then run pod install for it to work

Can you help me resolve issue on Android?

Answer 59 · 2019-11-23T12:53:07.000Z

@sanjaynegi

Thanks! It has worked for me.

Answer 60 · 2019-11-25T22:29:05.000Z

@sanjaynegi
Thanks a lot. It worked for me

Answer 61 · 2019-11-27T19:11:31.000Z

I also have this problem in Windows.

For to resolve, after install the dependencies. I run npx react-native run-android again.

Answer 62 · 2019-12-11T20:37:22.000Z

I also have this problem in Windows.

For to resolve, after install the dependencies. I run npx react-native run-android again.

This work's for me! Thank's man!!!

Answer 63 · 2019-12-26T00:28:25.000Z

pod install on ios folder works for me
cd ios
pod install

What are the magical commands should i write inside the Podfile to make it work ?

Answer 64 · 2019-12-26T02:57:34.000Z

@GeronimoKTT
In my case, on RN 0.60.0, the fix was to erase everything inside of react-native.config.js.

Where is this file located ? I didn't find it in RN60

Answer 65 · 2019-12-30T06:02:00.000Z

For android,

1--> cd android/

2--> ./gradlew clean

3--> cd ../

4--> Run your project now

I don't know is this an exact answer? But it works for me

Answer 66 · 2020-01-09T19:48:37.000Z

I was facing the same issue.

In my case the problem was that I was working on two projects simultaneously. And Metro-Bundler was started in the root directory of first project.

When I started the Metro-Bundler in second project It worked fine.

Answer 67 · 2020-01-18T01:11:34.000Z

I was facing same issue. Steps I did to rid the issue:

ranrm -rf node_modules && yarn install && cd ios && pod install && cd ..
delete app from simulator
ran react-native run-ios --simulator='\''iPhone X'\''
closed Metro-Bundler and restarted it

~ hope this helps

Answer 68 · 2020-01-23T13:17:20.000Z

In my case, Another packager was running

Answer 69 · 2020-01-26T13:36:39.000Z

Hey all,
For me, it was simply closing your ios simulator and metro and run react-native run-ios again.

Let it re-build everything.

Answer 70 · 2020-01-29T13:11:49.000Z

I followed the instructions from the documentation: https://facebook.github.io/react-native/docs/integration-with-existing-apps and run into this issue on linux with android
"react": "16.9.0",
"react-native": "0.61.4",

Answer 71 · 2020-02-09T23:20:14.000Z

Hi,
Please first run this command : npm uninstall react-native-gesture-handler --save
Second : npm install react-native-gesture-handler --save
Third : react-native link react-native-gesture-handler
Forth : npm start
Finally this is work :))

Answer 72 · 2020-02-16T18:59:27.000Z

It happened to me, I needed to link missing dependencies.

Answer 73 · 2020-02-17T09:08:19.000Z

The same problem is come with me today after init example project.
Just run

npm i react-native-gesture-handler

(cd ios && pod install)

Wasted my time :(

Answer 74 · 2020-02-17T17:28:19.000Z

Finally, I quit React Native. Either you can waste your time fixing bugs or you can make your project, it's on your luck.

I can really feel your pain man, in react native you install one library then you do 10 google searches on how to fix one issue or the other 😄

Answer 75 · 2020-02-19T10:37:09.000Z

This worked. Thanks, @har2008preet! 🚀
pod install on ios folder works for me
cd ios
pod install

When I make cd ios I get this error:

   -bash: cd: ios: No such file or directory

I have a folder named iOS in Pods

Answer 76 · 2020-02-20T11:57:22.000Z

This worked for me, although not entirely sure it'll fix everybody's problem. In these docs https://reactnavigation.org/docs/en/getting-started.html it's specified:

To finalize installation of react-native-screens for Android, add the following two lines to dependencies section in android/app/build.gradle:

implementation 'androidx.appcompat:appcompat:1.1.0-rc01'
implementation 'androidx.swiperefreshlayout:swiperefreshlayout:1.1.0-alpha02

Answer 77 · 2020-02-22T08:09:19.000Z

Hi,
Please first run this command : npm uninstall react-native-gesture-handler --save
Second : npm install react-native-gesture-handler --save
Third : react-native link react-native-gesture-handler
Forth : npm start
Finally this is work :))

This work for me, thank you,
run well in ios and android, react navigation 5.x

Answer 78 · 2020-02-28T01:32:03.000Z

In my case use_native_modules! was missing from my Podfile, that will make pod install to install the missing module(s)

Answer 79 · 2020-02-28T02:13:29.000Z

This worked for me
npm install --save react-native-gesture-handler
react-native link
Again
cd ios
pod install

Answer 80 · 2020-03-09T10:17:52.000Z

As it turned out all I needed was a gradle clean (./gradlew clean) and then copying the "\android\app\build\outputs\apk\debug\app-debug.apk" manually into the device and installing (also manually) and all errors vanished.

Answer 81 · 2020-03-09T10:18:36.000Z

In case anyone needs the versions:
"dependencies": {
"react": "16.9.0",
"react-native": "0.61.4",
"react-dom": "~16.9.0",
"react-native-gesture-handler": "~1.5.0",
"react-native-safe-area-context": "0.6.0",
"react-native-screens": "2.0.0-alpha.12",
"react-native-web": "~0.11.7",
"@react-native-community/datetimepicker": "^2.2.3",
"@react-native-community/masked-view": "0.1.5",
"@react-navigation/bottom-tabs": "^5.0.0",
"@react-navigation/native": "^5.0.0",
"@react-navigation/stack": "^5.0.0",
"@react-navigation/web": "~1.0.0-alpha.9"
},
"devDependencies": {
"@babel/core": "^7.6.2",
"@babel/runtime": "^7.6.2",
"@react-native-community/eslint-config": "^0.0.5",
"babel-jest": "^24.9.0",
"eslint": "^6.5.1",
"jest": "^24.9.0",
"metro-react-native-babel-preset": "^0.56.0",
"react-test-renderer": "16.9.0"
},

Answer 82 · 2020-03-09T17:49:46.000Z

@MrHazimAli I do a video my step resolve issue here:

For Android: https://youtu.be/NcQhDlC7hT8

For IOS:
-- cd ios
-- pod install

video link expired!

Answer 83 · 2020-03-11T06:53:00.000Z

Just close the terminal and delete the app and run it again it will do it.

Answer 84 · 2020-03-11T07:54:07.000Z

Just close the terminal and delete the app and run it again it will do it.

how do you want to run a deleted app?
I suppose you mean a clean build. I did it multiple times, also with deleting node_modules and caches.
Non of it helped :(

Answer 85 · 2020-03-13T18:01:17.000Z

This happens to me after installed React Navigation with the Android Simulator opened before.

So...I've

1 - finished the process

2- deleted the App in Simulator

3 - run npx react-native run-android again,

worked.

Maybe React cannot update his new deps on an old installed App?

Answer 86 · 2020-03-20T20:48:19.000Z

If you get this error on iOS but the android version works fine, Do this:

Go to node_modules > react-native-gesture-handler > GestureHandler.js.
In there, comment this line:
export { default as Directions } from './Directions';

And there you go!!!

Answer 87 · 2020-03-26T05:43:13.000Z

@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}

You're my hero!

Answer 88 · 2020-03-26T23:31:27.000Z

i trying to fix this for 4 hours, if you are running in mac and try to use the ios simulator ty to do this:

cd ios
pod install

but after this restart the server and i think is gonna works, just like work for me

Answer 89 · 2020-03-28T18:17:17.000Z

I am using "react-native": "0.61.5"
I am working on ubuntu 18.04
I fixed the issue on my android emulator by following the steps mentioned below

Make sure you follow steps for the version you are using (React Native 0.61.5 and lower in my case)

Delete/Remove your node_modules directory
rm -rf node_modules
Install your dependencies again
If you are using Yarn $ yarn or npm install if you are using npm
Clean your Gradle
I followed below steps for that:

cd android
./gradlew clean
cd ..
react-native run-android

Good Luck, These steps worked for me

Answer 90 · 2020-04-07T03:20:18.000Z

I am using "react-native": "0.61.5"
I am working on ubuntu 18.04
I fixed the issue on my android emulator by following the steps mentioned below

Make sure you follow steps for the version you are using (React Native 0.61.5 and lower in my case)

Delete/Remove your node_modules directory
rm -rf node_modules

Install your dependencies again
If you are using Yarn $ yarn or npm install if you are using npm

Clean your Gradle
I followed below steps for that:

cd android
./gradlew clean
cd ..
react-native run-android

Good Luck, These steps worked for me

thanks this trick work for me

Answer 91 · 2020-04-09T11:37:43.000Z

thanks this trick work for me

I am glad it worked for you!

Answer 92 · 2020-04-20T16:11:12.000Z

@meraklis56 try to commenting this line:

// export { default as Directions } from './Directions';

in the your project -> node_modules -> react-native-gesture-handler -> GestureHandler.js

Good luck.

Thank you. It worked for me.

Answer 93 · 2020-07-24T14:59:11.000Z

https://reactnavigation.org/docs/troubleshooting#im-getting-an-error-null-is-not-an-object-evaluating-rngesturehandlermoduledefaultdirection

This may help some people out there.

Please provide link repo with reproduction example, we can't take any sensible action with only this screenshot.

Answer 94 · 2020-07-25T13:42:49.000Z

Duplicate of #494.

Answer 95 · 2020-09-25T17:53:27.000Z

In react-native@0.59.10 it doesn't work. I still get the same error, even after jetify "null is not an object ( evaluating 'RNGestureHandlerModule.default.Direction')"

Remove this modification: // export { default as Directions } from './Directions';

And if you specified something in your "react-native.config.js", remove it.

add these lines in your MainActivity.java:
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

And add this inside the MainActivity class, just after protected String getMainComponentName() function
@Override
protected ReactActivityDelegate createReactActivityDelegate() {
return new ReactActivityDelegate(this, getMainComponentName()) {
@Override
protected ReactRootView createRootView() {
return new RNGestureHandlerEnabledRootView(MainActivity.this);
}
};
}

And after that do:
cd android
gradlew clean
cd ..

Then do the usual: react-native run-android, and give me the output.
Good luck.

I was facing the same issue on Android 9 with

"@react-native-community/masked-view": "^0.1.10",
"@react-navigation/drawer": "^5.9.1",
"@react-navigation/native": "^5.7.4",
"react": "16.13.1",
"react-native": "0.63.2",
"react-native-gesture-handler": "^1.8.0",
"react-native-reanimated": "^1.13.1",
"react-native-safe-area-context": "^3.1.8",
"react-native-screens": "^2.11.0"

And this solution worked for me. Thanks a million!

Answer 96 · 2020-09-25T22:04:11.000Z

Hi, i'm still facing this issue, the message is slightly different (instead of null is undefined)

TypeError: undefined is not an object (evaluating '_RNGestureHandlerModule.default.Direction')

Answer 97 · 2020-10-03T13:08:47.000Z

if you are using android try this solution :
go to : /android/settings.gradle there was string:
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-gesture-handler\android')

tro to change it with :
project(':react-native-gesture-handler').projectDir = new File(rootProject.projectDir, '..\node_modules\react-native-gesture-handler\android')
source : #494 (comment)

Answer 98 · 2020-10-12T05:18:22.000Z

Hi, i'm still facing this issue,

TypeError: null is not an object (evaluating '_RNGestureHandlerModule.default.Direction')

and this is setting.gradle

rootProject.name = 'Something'
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'

Answer 99 · 2020-10-12T05:34:26.000Z

Hi, i'm still facing this issue,

TypeError: null is not an object (evaluating '_RNGestureHandlerModule.default.Direction')

My ------- setting.gradle
rootProject.name = 'some'
apply from: file("../node_modules/@react-native-community/cli-platform-android/native_modules.gradle"); applyNativeModulesSettingsGradle(settings)
include ':app'

Answer 100 · 2020-10-25T09:28:41.000Z

I was on a physical Android device debugging over Wi-Fi, the following solution worked for me:

Delete the installed app from your device.
Run cd android; ./gradlew clean from your project.
Reinstall the app react-native run-android on your device.
A server should have been started, open your installed up and it should run fine.

Hope this helps!