CODEWITHSUNDEEP
reactjsreduxredux-thunkthunk
mustafa arslantaş
mustafa arslantaş

Reputation: 81

Module not found: can't resolve' redux-thunk ' error I have tried the solutions but it does not happen.What is the solution?

I tried all the commands for redux but it doesn't work:how do you think the solution is. These are the commands I tried

yarn add react-redux
yarn add reduxjs / Redux-thunk#master
npm install --save Redux react-redux
npm install redux -- save
npm i redux -- save
yarn add redux-thunk

index.jsx 

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import {createStore, applyMiddleware,compose} from 'redux';
import rootReducer from './store/reducers/rootReducer';
import {Provider} from 'react-redux';
import thunk from 'redux-thunk';
import {reduxFirestore,getFirestore} from 'redux-firestore'
import {reactReduxFirebase,getFirebase} from 'react-redux-firebase'
import fbConfig from './config/fbConfig';


const store=createStore(rootReducer,
    compose(
        applyMiddleware(thunk.withExtraArgument({getFirebase,getFirestore})),
        reduxFirestore(fbConfig),
        reactReduxFirebase(fbConfig)
    ));


ReactDOM.render(<Provider store={store}><App /></Provider>, document.getElementById('root'));

package.json

{
  "name": "omaga-yazilim",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^npm i --save react-router4.2.4",
    "@testing-library/react": "^9.4.0",
    "@testing-library/user-event": "^7.2.1",
    "firebase": "^7.8.1",
    "jest-leak-detector": "^25.1.0",
    "moment": "^2.22.2",
    "react": "^16.6.3",
    "react-dom": "^16.6.3",
    "react-redux": "^7.1.3",
    "react-redux-firebase": "^3.1.1",
    "react-router": "^4.4.0-beta.8",
    "react-router-dom": "^4.4.0-beta.6",
    "react-scripts": "^2.1.1",
    "redux": "^4.0.5",
    "redux-firestore": "^0.12.0",
    "redux-thunk": "reduxjs/redux-thunk#master",
    "start": "webpack-dev-server --mode development"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Upvotes: 5

Views: 21101

Answers (5)

Shivam
Shivam

Reputation: 1

This error generally occurs due to version incompatibility of redux and redux-thunk

you can try using the compatible version then it will work

try uninstalling the existing version then install below version

as it has resolved my issue, can try this

npm install [email protected] [email protected]

Upvotes: 0

Mangala Karunarathne
Mangala Karunarathne

Reputation: 319

I also had the same issue...and this is how I resolved it...

Stop the server Ctrl + C

open package.json

and remove the available redux-thunk version and replace like below...

"redux-thunk": "^2.3.0",

and then go to terminal and install the redux-thunk using following command...

npm install redux-thunk

and then start the server

npm start

Upvotes: 0

RileyManda
RileyManda

Reputation: 2641

I had a similar issue with this and this is how i resolved it:

Stop the server:Ctrl C in terminal.

Open package.json and manually add:

"redux-thunk": "^2.3.0",

then in the terminal cd into the project and install redux thunk:

yarn add redux-thunk

restart the server:

yarn start

More details about redux thunk can be found on this link:

ReduxThunk-Github

Upvotes: 1

Souad Henane
Souad Henane

Reputation: 351

I faced the same problem but I run the command line:

npm install --save redux-thunk

Upvotes: 8

markerikson
markerikson

Reputation: 67469

The simplest solution is to use our new official Redux Toolkit package. The configureStore function will automatically set up the store correctly, including adding the thunk middleware by default. Given that you're trying to use React-Redux-Firebase, you can do that by using the getDefaultMiddleware API:

const store = configureStore({
    reducer: rootReducer,
    middleware: [...getDefaultMiddleware({
        thunk: {
            extraArgument: {getFirebase,getFirestore}
        }
    })],
    enhancers: [reduxFirestore(fbConfig), reactReduxFirebase(fbConfig)]
})

Upvotes: 3

Related Questions