[TIL] 원티드 프리온보딩_4일차_220506

오늘은 휴일입니다 :) 하지만 TIL 작성해보기!! 🤩

🍭classNames 사용 ?!

• 현재 CSS Moudlue을 쓰고있으며 className={styles.test} 라고 작성해주면 웹팩에서 자동으로 class="Todolist_test_a1234" 와 같이 난수화를 해준다.

" 📍classNames라이브러리는 언제 쓰는게 좋을까?!"

1. classNames 라이브러리를 사용할 때는 한 개 이상의 클래스명을 지정할 때
2. 조건부 클래스를 지정해 줄 때

• className={styles.test}
• className={cx(styles.test, styles.test2)}
• className={cx(styles.test, {[styles.test] : isShow })}

📌내가 조건부 클래스 지정해 줄 때는
className={!isShow? styles.arrowBtn : [styles.arrowBtn, styles.show].join(' ')} 와 같이 작성했었지만 아래와 같이 수정할 수 있다.

• className={cx(styles.arrowBtn, {[styles.show] : isShow})} 👏

😖npm 버전 업그레이드 오류?!

• 팀원분들과 conflict를 최소화하기 위해 npm 버전을 맞추기로 결정! 하지만 설치오류가 생겼다.. err에 나와있는대로 path찾아 들어가서 오류가 나는 파일들을 삭제하고 다시 npm install -g npm@[버전]을 하고나니 오류 해결!
• cmd의 에러메세지는 생각보다 더 친절하니,,에러 메세지를 잘 확인하자...휴,,!!!!

✔ upstream을 받아보자..

• git remote -v로 upstream이 등록 되어있는 지 확인하기
• git fetch upstream
• git merge upstream/develop

💥ERESOLVE unable to resolve dependency tree 해결하기

merge하는 과정에서 ERESOLVE unable to resolve dependency tree 라는 오류가 발생했다

react버전 문제로 오류가 발생한 것!
npm install과정에서 해당 오류를 무시하라는 코드를 사용하면 된다라는 말이었다!

📌 해결방법

1. npm install --force
2. npm install --legacy-peer-deps
3. npm config set legacy-peer-deps true
4. npm install

해당 링크를 참고하여 수정하였습니다.