Q＆A
혹시 윗분들 에러 상황에서 webpack-dev-server를 4버전으로 사용하실 경우 webpack.config.ts 파일 내에 import WebpackDevServer from 'webpack-dev-server' ; declare module 'webpack' { interface Configuration { devServer ?: WebpackDevServer . Configuration ; } } 이렇게 추가해도 해결되긴 하네요! 참고하셔도 괜찮을듯 싶습니다 참고 : https://githubmate.com/repo/survivejs/webpack-merge/issues/141?page=2
Q＆A
아...감사합니다!
Q＆A
답변 감사드립니다. 말씀대로 Menu.item 말고 그 내부에 Icon 이나 span 에 onClick 이벤트로 Modal 을 호출하니 잘 되네요. 이 방법은 Menu.item 범위 내의 Icon 이나 span 내용 범위만 클릭해야 Modal 을 출력해서 조금 부자연스러운데, 혹시 Menu.item 자체를 클릭했을 때 Modal을 출력할 다른 방안이 있을까요..?
Q＆A
아 네 제가 잘못말씀드렸네요 그럼 혹시 TypeError: "Invalid attempt to spread non-iterable instance" 이 에러는 그 원인에서 비롯된걸까요?:
Q＆A
죄송합니다 ~ 말씀하신 부분들 수정해서 다시 업로드했습니다. https://github.com/ljg0230/nodebird_ljg/tree/hotfix_1
Q＆A
죄송합니다 ㅠ 말씀해주신 부분들 로그로 확인했는데 데이터는 정상적으로 들어있어네요..
Q＆A
네 401 로그인 에러말고는 정확하게 파악이 안되서요 hashtag로 불러오는건 정상적으로 잘 되고, 방금 쿠키 삭제 후 다시해봐도 그대로네요
Q＆A
네 리덕스툴에는 LOAD_USER_SUCCESS, LOAD_USER_POSTS_SUCCESS 확인했고, 콘솔탭 에러도 확인은 해봤는데... 원인은 못찾았네요 Error: "Request failed with status code 401" createError createError.js : 16 settle settle.js : 17 handleLoad xhr.js : 59 index.js :1 The above error occurred in one of your React components: in div (created by User) in span (created by Context.Consumer) in li (created by Context.Consumer) in ul (created by Context.Consumer) in div (created by Context.Consumer) in Card (created by User) in div (created by User) in User (created by NodeBird) in div (created by Context.Consumer) in Col (created by AppLayout) in div (created by Context.Consumer) in Row (created by AppLayout) in div (created by AppLayout) in AppLayout (created by NodeBird) in Provider (created by NodeBird) in NodeBird (created by withRedux(NodeBird)) in withRedux(NodeBird) in Suspense (created by AppContainer) in Container (created by AppContainer) in AppContainer React will try to recreate this component tree from scratch using the error boundary you provided, Container. index.js :1 e index.js : 1 NextJS 22 Redux 5 e 2 : 1 Redux 12 Warning: Container: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI. index.js :1 Error: Objects are not valid as a React child (found: object with keys {id}). If you meant to render a collection of children, use an array instead. in div (created by User) in span (created by Context.Consumer) in li (created by Context.Consumer) in ul (created by Context.Consumer) in div (created by Context.Consumer) in Card (created by User) in div (created by User) in User (created by NodeBird) in div (created by Context.Consumer) in Col (created by AppLayout) in div (created by Context.Consumer) in Row (created by AppLayout) in div (created by AppLayout) in AppLayout (created by NodeBird) in Provider (created by NodeBird) in NodeBird (created by withRedux(NodeBird)) in withRedux(NodeBird) in Suspense (created by AppContainer) in Container (created by AppContainer) in AppContainer
Q＆A
여기저기 로그를 찍어보고 있지만 아직 못찾았네요ㅠ... 포스트 추가 (입력값 123)부터의 console.log를 순차적으로 확인해보면 in post sagas : {"content":"123"} post.js :60 in index.js(pages) : [null,{"id":1,"User":{"id":1,"nickname":"이정걸"},"content":"첫 번째 게시글","img":"","Comments":[]}] index.js :19 in PostCard.js / post : undefined 2 PostCard.js :42 이렇게 undefined가 되는걸 확인은 했으나 어디서 문제가 된 건지... 근데 이게 backend 에서 문제가 될 수 있는건가요???
Q＆A
답변 감사드립니다~ reducer ADD_POST_SUCCESS에서 console.log(action.data)라는 말씀은 reduce 함수 내에 switch 문 안에서 로그를 찍어보라는 말씀인가요? 우선 sagas 에서 function* addPost ( action ) { try { const result = yield call ( addPostAPI , action . data ) yield put ({ type: ADD_POST_SUCCESS , data: result . data , }); console . log ( action . data ); } catch ( e ) { yield put ({ type: ADD_POST_FAILURE , error: e , }); } } 이렇게 로그를 찍으면 object { content: "#test" } 이런 식으로 입력값이 로그에 잘 나오긴 합니다
