Good evening, I have a small problem. I code an application with React and Redux + Redux Toolkit and simply at the time of importing my reducer in the root reducer, therefore the rootReducer, I realize that my reducer therefore unReducer was not imported correctly, here is the problem.
I put the scope of my rootReducer.js in attachment with a focus on the module in question so FormConnexionReducer which is equivalent to unReducer in my code.
Thank you in advance for your answers.
unReducer.js
//importation des dépendances const unReducer = createSlice({ name: 'unReducer', initialState: { a: '', b: '', }, reducers: { print_a: () => console.log(a), print_b: () => console.log(b) }, }); const {print_a, print_b} = unReducer.actions; export const print_aAction = () => ApplicationStore.dispatch(print_a()); export const print_bAction = () => ApplicationStore.dispatch(print_b()); export default unReducer.reducer;
rootReducer.js
import {combineReducers} from 'redux'; import {default as unReducer} from 'unReducer.js'; export default combineReducers({ // breakpoint, the picture of the scope is at the end of the post unReducer, });
breakpoint scope CLICK ON THE LINK TO SEE THE PICTURE
Advertisement
Answer
Your slice file seems to be referencing a store. If the slice references the store file and the store file references the slice file, you have a circular dependency.
JavaScript needs to execute one of the two files first – the imports from the other file will be undefined
at that point in time and only filled in later.
Identify your circle and move some stuff out into a third file to break it.