[REACT] Emotion 컴포넌트 선택자 사용시 에러

Emotion을 활용하다가 Component Selector(컴포넌트 선택자) 를 사용했더니 아래와 같은 오류가 발생했다. Component selectors can only be used in conjunction with @emotion/babel-plugin, the swc Emotion plugin, or another Emotion-aware compiler transform. Component Selector(컴포넌트 선택자)란 ?! const Card = styled(face)` padding: 20px; width: 150px; height: 220px; margin-right: 15px; position: relative; float: left; perspective: 600px; /*3..

→2023.11.16

오류들

[WEB] 티스토리 "hELLO" 스킨에 mac스타일 코드블럭 적용안되는 오류

필자는 이미 위와 같은 맥북 스타일을 사용하고 있었다. 근데 소중한 친구가 개발 블로그를 시작하고 싶다고 해서 이것 저것을 도와 주다가 위와같은 맥북 스타일을 넣는 것을 도전하고 있었다. mac스타일 코드블럭을 적용하는 방법 자체는 아래 글을 참조하면 쉽게 이해할 수 있다. https://guiyomi.tistory.com/132 [티스토리 블로그 테마] - 1. 코드 블록 디자인을 mac 코드 스타일로 바꾸기 글을 읽기 전 미리 보는 완성본은 다음과 같다. 어떻게 만들었고 적용했는지 궁금하신 분들은 아래로 스크롤! See the Pen tistory code block by MiJeong Kim (@sap03110) on CodePen. 발단 여느 날과 다름없이 회사 guiyomi.tistory.com..

→2023.11.08

오류들

[React] redux-thunk , dispatch 연결 안되는 오류

프로젝트를 진행하다가, redux를 활용해서 기능을 해줘야하는데, 비동기 처리를 해줘야 하는 경우가 생겼다. 따라서 원래 구현했던 redux 코드들에 redux-thunk 미들웨어를 추가해서 비동기 작업을 추가하려 해주었다. export const setBlockRightSizeAsync = ( payload: setBlockRightSizeType, ): ThunkAction => { //리턴타입, Root상태, ExtraArgument타입, action의 타입 순서대로 넣음 const { leftPos, dayPosMap, id, width, projectId } = payload; return async (dispatch, getState) => { /* 생략 ... */ dispatch(setB..

→2023.05.08

오류들

[웹서버] 라즈베리파이와 prisma

프로젝트를 하던 중 문제가 발생했다... 이번 프로젝트에선 ORM으로 prisma를 선택했는데, 로그인 작업을 마친 후에 prisma를 적용하고 자동 CI/CD에서 오류가 발생하기에 오랜만에 ssh를 통해서 직접 서버에 접속해서 확인해보니 아래와 같은 에러가 발생하였다. 조사를 조금 해보니 prisma는 ARMv7 아키텍처를 공식적으로 지원하지 않는데, 라즈베리파이가 바로 해당 아키텍쳐였다. 이를 해결할 수 있는 방법은 크게 2가지가 존재했다. 첫번째는 직접 prisma 파일 자체를 git clone 명령어를 통해서 가져온 후, 이런저런 환경변수 세팅또한 직접 해주고 엔진을 직접 빌드시키는 방법이 존재했다. 두번째는 gitHub 이슈를 돌아다니다가 발견했는데, @pantharshit00 @aqrln @j..

→2023.04.02

오류들

[CSS] border-right 안나올때

작업을 진행하다가 border-right가 나오지 않는 문제에 부딪혔었다. 처음에는 뭔가 안쪽요소에 밖의 요소가 잡아먹혔나 생각했다. position이 absolute라서 그런가? 등등 계속 생각도 해보고 codepen을 띄워서 재현을 해보려고도 했다. 그런데 어떤 방법을 써도 문제는 재현되지 않았고 내 프로젝트 안에서만 발생했다. outline속성을 주었을때는 테두리가 잘 나왔기 때문에 문제를 계속 찾았다. 하던중에 문득 !important를 주면 어떻게 될까란 생각이 들어서 주었더니 테두리가 정상적으로 나왔다... 그럼 결국 겹친 요소가 있었다는 건데 내 머리로는 도저히 이해가 되지 않았고 결국 리액트를 build해서 하나의 css파일로 만든 후에 border-right를 건드린 부분들을 다보았다. ..

→2023.03.19

오류들

[git] 'file' does not have a commit checked out 에러

NestJs 프로젝트를 git add. 를 통해 커밋을 하려 했는데 다음과 같은 오류를 내보내면서 제대로 되지 않았다. 또한 수정 내역이 다 사라져 버리는현상이 발생히버렸다... git Desktop으로 확인해보니 empty file로 인식하고 있었던 것. 알고보니 하위 폴더 안에 .git 폴더가 또 있으면 발생하는 문제였다. 해당폴더를 삭제해주면 된다. 만약 폴더가 보이지 않다면 숨김폴더옵션을 체크한 후에 검색해보는것을 추천한다. 만약 이미 git add.를 해버렸다면 하위폴더안에 들어가서 git reset HEAD 명령어로 add를 복원한 후에, 하위폴더안의 .git 파일을 삭제하면 된다. 이후 git add.를 하면 잘 동작한다.

→2023.01.24