85

I have create a new react application using create-react-app cli. Then i have added the 'react-redux' library using npm install --save react-redux.

In package.json I have:

"react-redux": "^4.4.5"

Unfortunately, the app doesn't compile and it complains with:

Error in ./~/react-redux/lib/utils/wrapActionCreators.js
Module not found: 'redux' in C:\Users\Salman\Desktop\Courses\Internship\React\Youtube-Front-End\node_modules\react-redux\lib\utils

 @ ./~/react-redux/lib/utils/wrapActionCreators.js 6:13-29

I have no idea what does it mean?

Here is the complete container:

import React,{Component} from 'react';
import {connect} from 'react-redux';

class BookList extends Component{
  renderList(){
        return this.props.books.map((book)=>{
          <li key={book.title} >{book.title}</li>
        });
    }

  render(){

    return(
      <div>
        <ul>
          {this.renderList()}
        </ul>
      </div>
    );
  }
}

function mapStateToProps(state){
  return{
    books:state.books
  };
}

export default connect(mapStateToProps)(BookList);

Here is complete package.json:

{
  "name": "Youtube-Front-End",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-scripts": "0.6.1",
    "webpack": "^1.13.2"
  },
  "dependencies": {
    "react": "^15.3.2",
    "react-dom": "^15.3.2",
    "react-redux": "^4.4.5",
    "youtube-api-search": "0.0.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}
Jimmy
  • 8,682
  • 24
  • 84
  • 144

7 Answers7

230

You need to install react-redux but also redux library.

npm install --save redux
Borjante
  • 7,488
  • 5
  • 30
  • 49
  • 6
    shorthand... npm i -S redux – Justin Russo Jan 30 '19 at 14:21
  • it is a devdependencie or a dependenci like react? – ValRob Mar 13 '19 at 09:13
  • No, normal dependency – Borjante Mar 13 '19 at 09:28
  • 1
    no need to put the --save. `npm install --save redux` and `npm install install redux` are the same (`--save` is the default option) [doc](https://docs.npmjs.com/cli/install) – Gaspar Apr 03 '19 at 01:15
  • $ npm i -S redux # OR $ yarn add redux – xgqfrms May 14 '19 at 07:26
  • Note: My own experience was that I ran `npm i --save redux redux-react axios redux-thunk`, where `redux-react` wasn't right, it should have been `react-redux`. A very handy warning came up to tell me that I "...meant to install react-redux." So, I did that and then I was getting this error w/o looking at my package.json. So, yes, this answer is correct, but as a note to community, if one package in `npm install` attempt fails, the whole thing roles back. – Neil Guy Lindberg Dec 29 '20 at 23:00
17

react-redux internally uses Action, ActionCreator, AnyAction, Dispatch, Store these interfaces form redux package.

the moment you call

export default connect(mapStateToProps,mapDispatchToProps)(App);

react-redux try to make use of all these interfaces from redux package. which is not present at the moment.

So you may have to install react-redux package along with redux since both have dependency.

 npm install --save redux react-redux
Amruth L S
  • 4,439
  • 1
  • 21
  • 38
2

Set moduleResolution to node at tsconfig.json

Example:

  "compilerOptions": {
    "moduleResolution": "node"
  }
Ricardo Rivas
  • 610
  • 6
  • 8
2

You can use the following command:

using npm

npm install redux --save

using yarn

yarn add redux
Khabir
  • 3,147
  • 1
  • 11
  • 18
1

I had the same challenge while working with Visual Studio Code (VSC) IDE.

import { createStore, combineReducers, applyMiddleware } from 'redux';

The 'redux' package was being resolved from another place all together, as a dependency within some typescript packages.

I ran yarn add redux@3.7.2 (with the VSC terminal) to re-install the package. Note that i had the exact version within my package.json as a dependency, and this helps yarn to link the dependencies faster since my goal was not to upgrade redux yet.

MwamiTovi
  • 1,454
  • 7
  • 20
0

I put my all redux related files to src/redux folder and after some search, I found that this folder name can cause conflicts. After changing the folder name everything works fine.

y.selimdogan
  • 396
  • 2
  • 6
-1

using npm :

npm install redux --save

using yarn :

yarn add redux