We Keep Coding

export 'store' (imported as 'store') was not found in './app/store' (possible exports: default)

index.js file:
import React from 'react';
import { createRoot } from 'react-dom/client';
import { Provider } from 'react-redux';
import { store } from './app/store';
import App from './App';
import reportWebVitals from './reportWebVitals';
import './index.css';
const container = document.getElementById('root');
const root = createRoot(container);
root.render(
<React.StrictMode>
<Provider store={store}>
<App />
</Provider>
</React.StrictMode>
);
reportWebVitals();
store.js file:
import { configureStore } from '#reduxjs/toolkit';
import userReducer from '../features/userSlice';
export default configureStore({
reducer: {
user: userReducer,
},
});
ERROR:- ERROR in ./src/index.js 16:11-16
export 'store' (imported as 'store') was not found in './app/store'
(possible exports: default)

You export store as default export you need to import it as default
index.js
import React from 'react';
import { createRoot } from 'react-dom/client';
import { Provider } from 'react-redux';
import store from './app/store';
import App from './App';
import reportWebVitals from './reportWebVitals';
import './index.css';
const container = document.getElementById('root');
const root = createRoot(container);
root.render(
<React.StrictMode>
<Provider store={store}>
<App />
</Provider>
</React.StrictMode>
);
reportWebVitals();

You are wrong coming from two reasons:
Reason number one: you already export the store as default and you import it with {} the first thing you should remove is the {}. to be like below:
import store from './app/store';
Reason number one:
Write store in capital letters to be Store finally to be like below:
import Store from './app/store';

Im implementing react redux in my react project. but this error came dont know how?

index.js
import React from 'react'
import ReactDOM from 'react-dom'
import './index.css'
import App from './App'
import { Provider } from 'react-redux'
import store from './store'
ReactDOM.render(
<React.StrictMode>
<Provider store={store}>
<App />
</Provider>
</React.StrictMode>,
document.getElementById('root')
)
store.js
import { createStore, combineReducers } from 'redux'
import thunk from 'redux-thunk'
import { composeWithDevTools } from 'redux-devtools-extension'
import { bookReducers } from './reducers/bookReducers'
const reducer = combineReducers({
book: bookReducers,
})
const middleware = [thunk]
const initialState = {
books: [],
isLoading: false,
eror: '',
}
const store = createStore(
reducer,
initialState,
composeWithDevTools(...middleware)
)
export default store
error I got in my console
I got this error from provider component while adding prop store but its the same as in redux docs . what is happening here

How to enable Hot Module Replacement with Create React App + Redux

I would like to enable Hot Module Replacement in my Web App, so I can speed up my development time.
I followed this article: https://duske.me/setting-up-hot-module-replacement-with-create-react-app-and-redux/
And i re-wrote my index.js
import React from 'react';
import ReactDOM from 'react-dom';
import {render} from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import {Provider,connect} from 'react-redux';
import FirebaseConfig from './FirebaseConfig';
import firebase from 'firebase';
import configureStore from './configureStore';
firebase.initializeApp(FirebaseConfig);
const store = configureStore();
render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
)
serviceWorker.unregister();
and I have created a configureStore.js :
import {createStore,applyMiddleware} from 'redux';
import reducer from './reducers';
import thunk from 'redux-thunk';
import {composeWithDevTools} from 'redux-devtools-extension' // REDUX DEVTOOLS
const configureStore = ()=> {
const store = createStore(reducer,composeWithDevTools(applyMiddleware(thunk)));
if (module.hot) {
module.hot.accept('./reducers/index', () => {
const nextRootReducer = require('./reducers/index').default;
store.replaceReducer(nextRootReducer);
});
}
return store
}
export default configureStore;
PS. 'reducers/index.js' is the file where I have a default export for my rootreducer (achieved by combining all reducers with combineReducers())
But nothing seems to work.
Did I miss something ?

How to fix Module not found: Can't resolve './store'

I'm setting up a React Redux with a Provider but it always comes back with an error message saying that ./store not being found. What I'm doing wrong here? and What do I need to set up in index.js file?
This is first I have looked at the React.js Redux website to tried to set up Provider and setup react-cookies.
import 'bootstrap/dist/css/bootstrap.min.css';
import React from 'react';
import ReactDOM from 'react-dom';
import './sass/main.scss';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { Provider } from 'react-redux'
import { CookiesProvider } from 'react-cookie';
import store from './store'
const rootElement = document.getElementById('cantainer')
ReactDOM.render(
<Provider store={store}>
<CookiesProvider>
<App />,
rootElement
</CookiesProvider>
</Provider>
);
serviceWorker.unregister();
import 'bootstrap/dist/css/bootstrap.min.css';
import React from 'react';
import ReactDOM from 'react-dom';
import './sass/main.scss';
import App from './App';
import * as serviceWorker from './serviceWorker';
import { Provider } from 'react-redux'
import { CookiesProvider } from 'react-cookie';
import store from './store'
const rootElement = document.getElementById('cantainer')
ReactDOM.render(
<Provider store={store}>
<CookiesProvider>
<App />,
rootElement
</CookiesProvider>
</Provider>
);
This is error message:
./src/index.js
Module not found: Can't resolve './store' in '/Users/mirasmith/Desktop/KPV1-Project-master/src'

React+Redux - Uncaught Error: Actions may not have an undefined "type" property

I tried to create a simple react-redux-ajax working example, following Reddit API tutorial, but I get this error:
Uncaught Error: Actions may not have an undefined "type" property. Have you misspelled a constant?
The error is thrown by:
dispatch(fetchProducts(this.props)); in App.jsx
index.jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { compose, createStore, applyMiddleware } from 'redux'
import { Provider } from 'react-redux';
import thunkMiddleware from 'redux-thunk';
import createLogger from 'redux-logger';
import { createDevTools, persistState} from 'redux-devtools';
import DevTools from './DevTools.jsx';
import App from './App.jsx';
import rootReducer from './reducers.js';
const loggerMiddleware = createLogger();
function configureStore(initialState) {
return createStore(
rootReducer,
initialState,
DevTools.instrument(),
applyMiddleware(
thunkMiddleware,
loggerMiddleware
),
// Lets you write ?debug_session=<name> in address bar to persist debug sessions
persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/))
)
}
const store = configureStore();
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>, document.getElementsByClassName('products')[0]);

You just forgot to compose your enhancers, the third argument to createStore must be a function so you need to compose all your enhancers to provide a unique enhancer :
index.jsx
import React, { Component } from 'react';
import ReactDOM from 'react-dom';
import { compose, createStore, applyMiddleware } from 'redux'
import { Provider } from 'react-redux';
import thunkMiddleware from 'redux-thunk';
import createLogger from 'redux-logger';
import { createDevTools, persistState} from 'redux-devtools';
import DevTools from './DevTools.jsx';
import App from './App.jsx';
import rootReducer from './reducers.js';
const loggerMiddleware = createLogger();
function configureStore(initialState) {
return createStore(
rootReducer,
initialState,
compose(
applyMiddleware(
thunkMiddleware,
loggerMiddleware
),
DevTools.instrument(),
persistState(window.location.href.match(/[?&]debug_session=([^&]+)\b/))
)
)
}
const store = configureStore();
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>, document.getElementsByClassName('products')[0]);
Redux DevTool doc