sharingStorage

vite + yarn 환경에서 배포 전 모바일로 개발환경을 보고싶을 때의 방법을 기록해두려고 합니다. 많은 참고 링크가 있었지만 결국 너무 기초적인 부분을 해결을 안했어서 이 글이 누군가에게 도움이 되길 바라며,,, 0. 데스크탑과 모바일 같은 와이파이 연결 우선 기본적으로 모바일과 데스크탑이 같은 와이파이에 연결돼있어야 합니다. 제일 먼저 yarn dev로 로컬환경을 실행했을 때 이렇게 나오는데 이걸 무시하고 별짓을 다하고 돌아보니 --host 옵션을 사용해야 한다는 것이였습니다. 아마 이걸 놓치지 않았다면 아래에 과정들을 아무것도 안해도 됐을텐데 오히려 좋네요 1. yarn dev --host 명령어 사용 2. cmd 창을 켜서 ipconfig 명령어 사용 3. 모바일로 IPv4 주소 + :5173 ..

styled-components를 사용하다보면 너무 많은 컴포넌트가 생성하면서 아래와같이 classname으로 구분이 힘들어질 때가 생깁니다. 이때마다 안의 CSS 내용을 보고 파일을 찾아갔었는데 그래서 좋은 방법이 없을까 하고 찾아보다가 이에 해당하는 bable plugin이 존재한다는 것을 찾게 되었고 적용하는 방법을 기록해볼까 합니다. Create-react-app 환경 create-react-app에는 다음과 같이 import하면 끝 import styled from 'styled-components/macro'; 이번에 vite를 사용하며 초기세팅해본 결과 cra와는 다르게 vite.config에도 동시에 설정해야되는 것이 많음 (ex: tsconfig baseUrl ) 설정과정 vite-plu..