[개발 공부 42일차] Redux-Toolkit, Redux Error

 

오늘은 다소 짧은 포스팅이 될 것 같다. 과제 하고 하루 종일 코드 짜느라 개념이나 다른 걸 공부할 여유가 없었다.

 

 

< 목차 >
1. [plugin:vite:import-analysis] Missing "./modules/letters" specifier in "redux" package
2. Uncaught TypeError: Cannot read properties of undefined (reading 'filter')
3. 금일 소감

 

 

1. [plugin:vite:import-analysis] Missing "./modules/letters" specifier in "redux" package

[plugin:vite:import-analysis] Missing "./modules/letters" specifier in "redux" package

 

 

이번 과제에선 타인의 코드를 읽는 능력도 함께 길러보자 하는 생각으로, 어려운 길이 되겠지만... 내 코드가 아닌 튜터님이 제공해주신 코드를 가지고 심화 과제를 하고자 코드를 clone해왔다. 그래서인지 파일 경로부터 위처럼 정체 모를 툴킷까지 에러가 정말 많이 떴다. 하루 종일 당황당황;;이었지만 일단 가보자.. 하고 저 에러에 대해 엄청 알아봤다. 그래서 많이 고민하고 알아봤는데,

 

 

devToolsEnhancer가 뭔데,,,,

 

 

devToolsEnhancer의 정체를 아직까지 모르겠다. 찾아보고 뭐가 문젠지 찾다가 심지어 설치까지 해줬는데 오류만 나길래 답답해진 나... 혼자 고민 오래 하다가 결국 튜터님께 찾아갔다. 아래와 같이 configureStore를 사용하니 해결되었다. devToolsEnhancer는 Redux Toolkit 안에 내장돼있어서 신경쓸 필요 없다고 하셨다.

 

그리고 절대경로, 상대경로를 혼용해서 써가지고 오류가 재발해서 헤매다가 다시 절대경로 설정한 것을 지우고 다시 실행했다. 그러니 다시 화면이 보였다. 해결.. 휴,,, 내 코드로 안 하니까 이런저런 오류가 많군..........는 무슨 이건 내가 바로바로 해결하지 못한 역량 때문이오 🥲

 

 

// import { createStore, combineReducers } from 'redux';
// import { devToolsEnhancer } from 'redux-devtools-extension';
import { configureStore } from '@reduxjs/toolkit';
import letters from '../modules/letters';
import member from '../modules/member';

const store = configureStore({
    reducer: { letters, member },
});

// const rootReducer = combineReducers({ letters, member });
// const store = createStore(rootReducer, devToolsEnhancer());

export default store;

 

 

 

2. Uncaught TypeError: Cannot read properties of undefined (reading 'filter')

Uncaught TypeError: Cannot read properties of undefined (reading 'filter')

 

 

letter가 undefined라고 떠서 console로 디버깅을 시작했다. 

 

 

undefined

 

 

undefined가 나오는 걸 확인할 수 있었고, 그럼 state에 접근하면 되려나 싶어서 바로 state.letters에서 letters를 지웠다. 아마 letterSlice를 해줘서 이름 변경 때문에 이런 문제가 생긴 것 같다 싶었다.

 

 

해결!

 

 

예상이 맞았다. Redux-Toolkit으로 refactoring 할 때, 바꿔준 이름인 letterSlice로 접근하니 해결되었다. 뿌-듯

 

 

 

3. 금일 소감

오늘도 하루 종일 코드 짜고 공부했다. Redux-Toolkit의 사용법이 잘 이해가 가지 않아서 정말 해설과제 보고 밤새도록 코드만 따라쳤다. 중간중간 이해가 되고 이제 어제나 그제보다 더 Redux-Toolkit의 구조가 이해가 되고 어떻게 동작하는지 전보단 알게 되었다. 그래도 아직 부족하긴 하다.

 

과제 재제출이 14시까지인 걸로 알고 있다. 이번 과제도 진짜 어려웠다. 그래도 해설 강의를 들으니 그나마.... 이해가 되었다. 여러 번 보고 코드 따라치고 이해하는 수밖에 없을 듯하다. 잠을 적게 자거나 밤새워서 피로는 한데 그래도 재밌다 ㅎㅎ

 

오늘.. 음 자정이 지났으니 어제인데, 어제 현 팀원 중에 한 분이 중견기업에 취업해서 함께하지 못하게 되었다. 같이 하지 못 해서 아쉽기도 하고, 이번도 3명인가 싶은 생각도 들었다. 그래도 난 우리팀.. 챌린지 믿어... 아무튼 오늘도 파이팅 하자. 목표한 공부량 다 채워보자 오늘두!!!