Typescript-react-starter: Error: "Expected 4 type arguments, but got 1"

Created on 18 Apr 2018  路  13Comments  路  Source: microsoft/TypeScript-React-Starter

I followed along with all of the steps in the README. After following the steps in "Creating a store" The app fails to compile and provides an error:
"my-app/src/index.tsx
(12,27): Expected 4 type arguments, but got 1."
I cloned the master branch from this repo and compared my code to yours and even went as far as copying/pasting your code over mine to make sure I wasnt missing anything. None of that fixed the error. Please advise

Most helpful comment

Why was this issue closed if the tutorial still uses the outdated syntax?

All 13 comments

An update (4.0.0) of Redux was released today, are you by chance already using that? The createStore signature has changed from the last released version 3.7.2.

on 3.7.2 the createStore signature is this:

export interface StoreCreator {
  <S>(reducer: Reducer<S>, enhancer?: StoreEnhancer<S>): Store<S>;
  <S>(reducer: Reducer<S>, preloadedState: S, enhancer?: StoreEnhancer<S>): Store<S>;
}

whereas on 4.0.0 it now is

export interface StoreCreator {
  <S, A extends Action, Ext, StateExt>(reducer: Reducer<S, A>, enhancer?: StoreEnhancer<Ext, StateExt>): Store<S & StateExt, A> & Ext;
  <S, A extends Action, Ext, StateExt>(reducer: Reducer<S, A>, preloadedState: DeepPartial<S>, enhancer?: StoreEnhancer<Ext>): Store<S & StateExt> & Ext;
}

@creambyemute Just looked and I am using 4.0.0. Good catch, thanks for helping out so quickly!

Now I know redux 4.0.0 caused the issue. How can I fix it? How to change the codes at sr/index.tsx?

@etlolap Not sure if this is the solution to it, but this worked for me

I imported EnthusiasmAction

import { EnthusiasmAction } from './actions/index';

and used like below

const store = createStore<IStoreState, EnthusiasmAction, any, any>(enthusiam, {
  enthusiasmLevel: 1,
  languageName: 'TypeScript'
});

Thanks very much. I fixed issue quickly.
Maybe it works very well on 'redux': '^3.7.2'.

@haani104 This does not work for me. Error message as follows:

Type declaration of 'any' loses type-safety. Consider replacing it with a more precise type.

The following also works for me:

const store = createStore<IStoreState, EnthusiasmAction, null, null>(enthusiam, {
  enthusiasmLevel: 1,
  languageName: 'TypeScript'
});

Guess I'll have to replace the null's with something as soon as I start to use middleware

I still get an error:

const initialState: IStoreState = {
  enthusiasmLevel: 100,
  languageName: "TypeScript"
};

const store = createStore<IStoreState, EnthusiasmAction, null, null>(
  enthusiasm,
  initialState,
  null // otherwise preloadedState is ignored
);

Error:

Argument of type '(state: IStoreState, action: EnthusiasmAction) => IStoreState' is not assignable to parameter of type 'Reducer'.
Types of parameters 'state' and 'state' are incompatible.
Type 'IStoreState | undefined' is not assignable to type 'IStoreState'.
Type 'undefined' is not assignable to type 'IStoreState'.

When I hover createStore:

(alias) createStore(reducer: Reducer, preloadedState: DeepPartial, enhancer?: StoreEnhancer & null (+1 overload)
import createStore

Signatures:

export interface StoreCreator {
  <S, A extends Action, Ext, StateExt>(reducer: Reducer<S, A>, enhancer?: StoreEnhancer<Ext, StateExt>): Store<S & StateExt, A> & Ext;
  <S, A extends Action, Ext, StateExt>(reducer: Reducer<S, A>, preloadedState: DeepPartial<S>, enhancer?: StoreEnhancer<Ext>): Store<S & StateExt> & Ext;
}

Dependencies:

"dependencies": {
    "react": "^16.4.1",
    "react-dom": "^16.4.1",
    "react-redux": "^5.0.7",
    "react-scripts-ts": "2.16.0",
    "redux": "^4.0.0"
  },
  "devDependencies": {
    "@types/enzyme": "^3.1.10",
    "@types/enzyme-adapter-react-16": "^1.0.2",
    "@types/jest": "^23.1.1",
    "@types/node": "^10.3.4",
    "@types/react": "^16.4.1",
    "@types/react-dom": "^16.0.6",
    "@types/react-redux": "^6.0.2",
    "enzyme": "^3.3.0",
    "enzyme-adapter-react-16": "^1.1.1",
    "react-addons-test-utils": "^15.6.2",
    "typescript": "^2.9.2"
  }

Why was this issue closed if the tutorial still uses the outdated syntax?

If don't know what the type is, try to describe it as 'any'
const store = createStore(enthusiasm, {
enthusiasmLevel: 1,
languageName: 'TypeScript',
});

@mehmetnyarar did you find a solution? I have the same problem.

@eberkund @mehmetnyarar
back redux version to 3: npm install redux@3 --save, and back to guide code(one argument), it running success.
image

hey guys, @eberkund @chvin

It's been really a long time and i don't use this boilerplate in my projects anymore. Creating a React/TypeScript project is very easy now and I don't have any type problem with Redux as well )

Was this page helpful?
0 / 5 - 0 ratings