[React] Error: Rendered fewer hooks than expected. This may be caused by an accidental early return statement.
2024. 9. 17. 16:06
개발/Error note
로그인 할때 오류가 발생했다. 오류내용은 예상된 훅보다 적은 훅이 랜더링됐고 실수로 일찍 반환된 훅이 있다는 오류였다. 기존코드/** * 'EID_AUT' 쿠키가 있는지 확인하여 사용자가 로그인 상태인지 확인합니다. * 쿠키가 있는 경우 사용자를 '/preview' 페이지로 리디렉션합니다. */const checkLoggedIn = () => { const cookie = getCookie('EID_AUT') const U_IF = localStorage.getItem('U_IF') if (cookie && U_IF) { return true } else { return false }}if (checkLoggedIn()) { return }useLayoutEffect(() => {..
[vercel] .env에 환경변수로 넣어둔 값들을 추가해야 할 때
2024. 9. 5. 18:25
개발/Error note
Vercel로 배포 후 테스트 중 .env에 넣어둔 파일들의 변수값이 불러오지 않아 오류가 발생했다. git을 통해서 vercel은 배포되기때문에 .gitignore에 추가해둔 .env는 없는 파일이라 읽지 못했기 때문이다. 해결방법 해당 프로젝트에서 Settings를 들어간다 Project Settings에서 Environment Variables로 이동 env에 입력해뒀던 키와 값을 입력하고 save를 해준다 그리고 Deployments로 이동 Redeploy를 해준다. 그러면 오류없이 이제 화면이 잘 동작한다 ;)
[nvm] nvm 설치 후 npm: command not found가 뜰 때
2024. 8. 26. 19:41
개발/Error note
nvm enabled 와 진짜 별의 별 상황을 다 만난다 진짜 갑자기 환경설정이 풀렸는데 저렇게 쓰고 재부팅하니까 그냥 또 잘된다. 부들부들
[MSW] Warning: intercepted a request without a matching request handler: 경고 해결
2024. 8. 10. 10:41
개발/Error note
msw를 쓰는데 자꾸 Warning: intercepted a request without a matching request handler: 이런 경고가 떴다.MSW가 요청을 채가서 뜨는것 같은데 오류가 너무 많아서 개발하는데 불편함이 있었다.. MSW 공식문서에 해당 오류를 복사하니 바로 위에 해결책이 있었다. import { delay, http } from 'msw'import { adminHandlers } from './admin'import { authHandlers } from './auth/index'// 여러 handler를 한 곳에 묶어서 returnexport const handlers = [ // 처음에 구글, cdn등의 경고가 뜨는걸 막기위해 해당 응답들에대한 지연추가 ht..
[msw] 첫 랜더링시는 404, 이후 200이 뜨는 에러
2024. 6. 21. 08:20
개발/Error note
문제 처음 화면을 랜더링하면 404에러가 뜨고 이후에 무언가를 수정하고 요청하게되면 그때부터는 200이 떴다. 왜그러지 왜그러지 싶은데 콘솔에 찍히는 Mocking enabled.가 요청 이후에 찍히는게 좀 이상했다. 404에 대해서 구글링을 해봤는데 원하는 해결책이 없었다. 그래서 msw문서를 다시 찾아보다가 카테고리중 브라우저 환경에서 세팅하는게 있었다. 이 카테고리에서 Browser intergration의 예시가 리액트로 되어있었고 최상위 컴포넌트 랜더를 할 때 순서가 잘못되어 있는걸 알았다. 문제 원인import React from 'react' import { createRoot } from 'react-dom/client' import { App } from './app' import { w..