search

facebook / react-native

A framework for building native applications using React
https://reactnative.dev
MIT License
118.17k stars 24.21k forks source link

Redux Store throws error: "TypeError: undefined is not a function, js engine: hermes" #31210

Open EmaProv opened 3 years ago

EmaProv commented 3 years ago

Start implementing Redux on my react native app cause me some troubles. After adding the redux store.js file, the console throws me this error:

 ERROR  TypeError: undefined is not a function, js engine: hermes
 ERROR  Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
      This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes
 ERROR  Invariant Violation: Module AppRegistry is not a registered callable module (calling runApplication). A frequent cause of the error is that the application entry file path is incorrect.
      This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native., js engine: hermes

I really can't understand why it gives me this, someone could help me?

Here is my Store:

import {createStore, applyMiddleware, compose} from 'redux';
import {thunk} from 'redux-thunk';
import rootReducer from './src/reducers';

const initialState = {};

const middleware = [thunk];

const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;

const store = createStore(
  rootReducer,
  initialState,
  composeEnhancers(
    applyMiddleware(...middleware),
  ),
);

export default store;

And here is my App.js:

import React from 'react';
import {NavigationContainer} from '@react-navigation/native';

import DrawerNavigator from './src/routes/DreawerNavigator';

import {Provider} from 'react-redux';
import store from './store';

export default function App() {
  return (
    <Provider store={store}>
      <NavigationContainer>
        <DrawerNavigator />
      </NavigationContainer>
    </Provider>
  );
}

React Native version:

System:
    OS: Windows 10 10.0.19042
    CPU: (4) x64 Intel(R) Core(TM) i5-7200U CPU @ 2.50GHz
    Memory: 1.35 GB / 7.91 GB
  Binaries:
    Node: 14.16.0 - C:\Program Files\nodejs\node.EXE
    Yarn: Not Found
    npm: 6.14.11 - C:\Program Files\nodejs\npm.CMD
    Watchman: Not Found
  SDKs:
    Android SDK:
      API Levels: 29, 30
      Build Tools: 28.0.3, 29.0.2, 30.0.3
      System Images: android-29 | Automotive with Play Store Intel x86 Atom, android-29 | Android TV Intel x86 Atom, android-29 | Intel x86 Atom, android-29 | Intel x86 Atom_64, android-29 | Google APIs Intel x86 Atom, android-29 | Google APIs Intel x86 Atom_64, android-29 | Google Play Intel x86 Atom, android-29 | Google Play Intel x86 Atom_64, android-30 | Google APIs Intel x86 Atom
      Android NDK: Not Found
    Windows SDK: Not Found
  IDEs:
    Android Studio: Version  4.1.0.0 AI-201.8743.12.41.7042882
    Visual Studio: Not Found
  Languages:
    Java: Not Found
  npmPackages:
    @react-native-community/cli: Not Found
    react: 16.13.1 => 16.13.1
    react-native: ^0.64.0 => 0.64.0
    react-native-windows: Not Found
  npmGlobalPackages:
    *react-native*: Not Found

package.json

{
  "name": "fastbook_app",
  "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/drawer": "^5.12.4",
    "@react-navigation/native": "^5.9.3",
    "@react-navigation/stack": "^5.14.3",
    "react": "16.13.1",
    "react-native": "^0.64.0",
    "react-native-datepicker": "^1.7.2",
    "react-native-gesture-handler": "^1.10.3",
    "react-native-reanimated": "^2.0.0",
    "react-native-safe-area-context": "^3.2.0",
    "react-native-screens": "^2.18.1",
    "react-native-vector-icons": "^8.1.0",
    "react-redux": "^7.2.2",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0"
  },
  "devDependencies": {
    "@babel/core": "^7.13.10",
    "@babel/runtime": "^7.13.10",
    "@react-native-community/eslint-config": "^1.1.0",
    "babel-jest": "^25.1.0",
    "eslint": "^6.5.1",
    "jest": "^25.1.0",
    "metro-react-native-babel-preset": "^0.59.0",
    "react-test-renderer": "16.13.1"
  },
  "jest": {
    "preset": "react-native"
  }
}
faziloub commented 3 years ago

Same Issue

EmaProv commented 3 years ago

any suggestions??

FelipeSSantos1 commented 3 years ago

What is the version of your redux-thunk? if it's "^2.3.0" try to replace this import { thunk } from 'redux-thunk' with this import thunk from 'redux-thunk'

wmonecke commented 3 years ago

Same problem! For me it's working in dev but not in release. Very weird...

tthuwng commented 3 years ago

You can manually add the 0.7.0 version of the Hermes Engine that support Proxies and React Native 0.64.x

yarn add hermes-engine@0.7.0
cd android && ./gradlew clean
RobberJJ commented 2 years ago

Same Issue

The-Lone-Druid commented 1 year ago

did anyone find solution?

erencsknn commented 1 year ago

maybe fix as import rootReducers

LouisMuriuki commented 1 year ago

same issue here,i updated my dependecies now am facing the same error

siemya commented 1 year ago

same issue

shujer commented 1 year ago

same issue, any solution for this? --> fixed by add polyfill

import getOwnPropertyDescriptors from 'get-own-property-descriptors-polyfill' 
if (!Object.getOwnPropertyDescriptors) {   Object.getOwnPropertyDescriptors = getOwnPropertyDescriptors }
bokmark commented 9 months ago

same issue, any solution for this?

KamranZafar19 commented 8 months ago

What is the version of your redux-thunk? if it's "^2.3.0" try to replace this import { thunk } from 'redux-thunk' with this import thunk from 'redux-thunk'

yes it's working thanku

daruNBC commented 7 months ago

What is the version of your redux-thunk? if it's "^2.3.0" try to replace this import { thunk } from 'redux-thunk' with this import thunk from 'redux-thunk'

the inverse worked for me

ricardogk3 commented 7 months ago

You resolved the issue by adding curly braces to the import statement: import { thunk } from 'redux-thunk';. This change was necessary because redux-thunk provides named exports, and when importing a specific export, the use of curly braces is required in JavaScript.

Arbaz3008 commented 2 months ago

You resolved the issue by adding curly braces to the import statement: import { thunk } from 'redux-thunk';. This change was necessary because redux-thunk provides named exports, and when importing a specific export, the use of curly braces is required in JavaScript. this was right .into your store.js

Arbaz3008 commented 2 months ago

You resolved the issue by adding curly braces to the import statement: import { thunk } from 'redux-thunk';. This change was necessary because redux-thunk provides named exports, and when importing a specific export, the use of curly braces is required in JavaScript. this was right .into your store.js