Answer a question

So this piece of code works without problems in my react js app.

import reducers from "./reducer";
import middlewareFunctions from "./middleware";
import { createStore, combineReducers, applyMiddleware } from "redux";

const middleware = (store) => (next) => (action) => {
  const fn = Object.keys(middlewareFunctions).find(
    (key) => key === action.type
  );
  if (fn) return middlewareFunctions[fn](store, next, action);
  return next(action);
};
export default createStore(
  combineReducers(reducers),
  {},
  applyMiddleware(middleware)
);

However when I convert to react typescript it shows me that createStore is deprecated. And its recommended to use the configureStore method of the @reduxjs/toolkit package, which replaces createStore.

I read the details on Redux docs page: https://redux.js.org/introduction/why-rtk-is-redux-today But I am still struggling to understand how to adapt my code for configureStore

1. Question: Why is createStore deprecated on my React Typescript app but not on React Javascript?

2. Question: What is the correct approach now? Simply switching createStore to configureStore does not work.

Answers

createStore is also deprecated in javascript: https://github.com/reduxjs/redux/pull/4336/

1. Question: Why is createStore deprecated on my React Typescript app but not on React Javascript?

• It's also deprecated in javascript https://github.com/reduxjs/redux/pull/4336/
• It's easier to use configureStore with typescript (from all of my experience with redux) because with configureStore you can easily create your state types, dispatch types etc...

Now the recommanded way to use do a redux application is with configureStore.

FYI: configureStore use createStore internally

2. Question: What is the correct approach now? Simply switching createStore to configureStore does not work.

The correct approach now is to use configureStore from redux-toolkit.