TIL 24.11.27

📚 TIL

리액트 Props, Children
컴포넌트 이벤트

📦 패키지 설치 시 참고사항

1. npm과 의존성 관리

• npm은 패키지 설치 시 해당 패키지와 의존성 패키지를 함께 설치함
• 의존성 패키지는 설치한 패키지의 정상 작동에 필요한 파일들로 구성됨
• 새로운 버전 출시 시 의존성 간의 호환성 문제로 인한 에러 발생 가능

---

2. Vite 업데이트(6.0.0) 관련 에러

• 최근 Vite 6.0.0 버전 출시로 일부 라이브러리 설치 시 에러 발생
  • Vite 자체 업데이트로 인해 기존 라이브러리들과의 호환성 문제가 원인

---

3. 해결 방법

3.1. -legacy-peer-deps 옵션

• -legacy-peer-deps는 npm에서 제공하는 옵션으로, 이전 버전의 의존성 규칙을 무시하고 패키지를 설치할 수 있음
• 사용법:

  npm i [패키지 이름] --legacy-peer-deps

• 특징:
  • 호환성을 최대한 유지하면서 설치를 진행함 (😇 순한맛 해결책)
  • 임시방편이므로, 이후에는 관련 라이브러리들이 최신 버전에 맞게 호환되도록 업데이트하는 것을 권장

3.2. -force 옵션

• -force는 npm이 모든 의존성 충돌을 무시하고 강제로 패키지를 설치함
• 사용법:

  npm i [패키지 이름] --force

• 특징:
  • 모든 호환성을 무시하고 설치를 강행함 (🔥 매운맛 해결책)
  • 예상치 못한 심각한 오류가 발생할 수 있어 신중한 사용이 필요함

---

4. 불필요한 파일 삭제 명령어

4.1. rm -rf ./*

• 현재 디렉토리의 모든 파일과 하위 디렉토리를 삭제함
• 사용법:

  rm -rf ./*

• 주의사항:
  • 이 명령어는 현재 디렉토리 내의 파일만 삭제하므로 상대적으로 안전함
  • 하지만 사용 시 항상 신중해야 하며, 중요한 파일이 삭제될 수 있으므로 백업 후 사용을 권장

4.2. rm -rf /*

• 시스템의 루트 디렉토리(/)부터 시작해 모든 파일과 디렉토리를 삭제함
• ⚠️ 절대 사용 금지

💬 마치며

파일 여러개 왔다갔다 하려니까 중간중간 놓쳤다... 수업 마치고 실습 코드 다시 보니 이해가 됐다.
리액트, 타입스크립트 따로따로 보면 알겠는데 합쳐지니까 더 복잡해 보이는 느낌
그래도 연습문제 풀면서 감이 잡히는 것 같다
리액트 훅 진짜 걱정됨 😰 유튜브에서 강의 찾아봐도 아리송한 게 안 사라지는데 하다보면 감이 생기겠지 생각 중