running React Native app with Redux toolkit throws an error - reactjs

Question

When i try to the run app it shows a red screen with this error in the terminal
Error: Unable to resolve module `../../../../src/assets/images` from `node_modules/#reduxjs/toolkit/dist/redux-toolkit.cjs.production.min.js`:
but It occuurs on iOS as well
The only way to make it go so far has been uninstalling react-redux. I do not have any imports in my code that point to src/assets/images as I dont have an assets/images directory to begin with.
My index.js:
import React from 'react';
import 'expo-asset';
import 'react-native-gesture-handler';
import {AppRegistry, View} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
import { Provider as ReduxProvider } from 'react-redux';
import store from 'src/redux';
import React from 'react';
import 'expo-asset';
import 'react-native-gesture-handler';
import {AppRegistry, View} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
import { Provider as ReduxProvider } from 'react-redux';
import store from 'src/redux';
const reduxApp = () => (
<ReduxProvider store={store}>
<App />
</ReduxProvider>
)
AppRegistry.registerComponent('main', () => reduxApp);
Redux store:
import { configureStore, getDefaultMiddleware} from '#reduxjs/toolkit';
import logger from 'redux-logger';
import { persistStore } from 'redux-persist';
import reducer from './reducers'
const middleware = [...getDefaultMiddleware(), logger]
const store = configureStore({
reducer,
middleware,
})
export const persistor = persistStore(store);
export default store;
metro.config.js:
module.exports = {
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: true,
},
}),
},
};
babel.config.js
module.exports = function (api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
plugins: [
[
'module-resolver',
{
alias: {
src: './src',
screens: './src/screens',
redux: './src/assets/images',
assets: './assets',
},
},
],
],
};
};

Answer 1

The problem is your babel.config.js file. I'm guessing that you copy and pasted some code from somewhere else without understanding what it means.
redux: './src/assets/images',
This line right here tells the compiler that the location of the redux module is ./src/assets/images. It will look for the redux source code in that folder, which doesn't exist, instead of the default location which is ./node_modules/redux.
You don't want this so delete that line.