오늘 새로 배운 것
Uncaught TypeError: Cannot destructure property 'comments' of '(0 , react_redux__WEBPACK_IMPORTED_MODULE_1__.useSelector)(...)' as it is undefined.이 문제는 일단 comments에 넘어오는 값이 없으니 destructuring 할 게 없었고 알고보니 configureStore에 comment를 위한 store를 만들어주지 않았었고 그러다보니 getComment를 해도 읽어올 수가 없어서 그랬던 것 같다. 이 문제는 해결
react_devtools_backend.js:4012 A non-serializable value was detected in the state, in the path: `comments.error`. Value: 아니 왜 자꾸 뜨는거여... redux-persist 라이브러리 쓰지도 않는데...
찾아보니, Redux는 state, action에 직렬화가 불가능한 값을 전달할 수 없기 때문에 에러가 발생한 것이라고 한다.
posts add 할 때는 안 뜨는데 같은 코드인데 post 내 comment 추가할 때는 저런 오류가 계속 나는건지...
여튼, 일단 configureStore의 middleware를 건드리는 두 가지 해결책이 있는 것 같다.
하나는
middleware: (getDefaultMiddleware) =>
// getDefaultMiddleware({ serializableCheck: false }),또 하나는
import thunk from 'redux-thunk'
middleware: [thunk]근데 이게 근본적인 해결책인 것 같지는 않다. 찾아본 바에 의하면, 신뢰할 수 없는 데이터의 역직렬화는 본질적으로 위험하며 피해야 한다고 한다.
여기서 직렬화는 JSON.stringify를 통해 object를 string 형태로, 역직렬화는 JSON.parse로 문자열 형태의 객체를 다시 object 형태로 되돌리는 과정이다.
여튼 위의 문제 해결 후 계속 만난 GET, POST 404 오류로 또다시 엄청난 시간을 삽질하다가 발견한 원인은 db.json에 comment들을 저장하는 속성 이름이 comments여야했는데 comment여서였다;; 저거 한 글자 때문에 반나절을 삽질했다--
그다음 만난 무수한 에러
Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.이건 또 왜이러냐--
