인프런 커뮤니티 질문&답변
작성한 질문수
lucide react 아이콘 설치
작성
·
17
0
저는 npm i lucide-react로 아이콘을 사용하고 있는데 미션에 제공하는거랑 버전도 다르고 아이콘도 다른데 제가 따로 다른 명령어로 설치하고 있는걸까요?
퀴즈
다음 중 라우트 변경 시 컴포넌트 리마운트를 유발하여 상태 초기화를 제공하는 파일은 무엇일까요?
`layout.tsx`
`template.tsx`
`page.tsx`
`middleware.ts`
답변 2
0
안녕하세요. 😀
아마 최근에 버전이 업데이트되면서 (지난주)
영상에서 사용한 아이콘과 현재 결과가 다르게 보이는 것 같습니다.
아래 명령어를 사용하시면 강의에서 사용한 버전과 동일하게 설치할 수 있어,
문제 없이 실습을 진행하실 수 있습니다.
npm install lucide-react@^0.562.0보통 실습은 제공된 예제 코드를 기준으로 진행하시기를 권장드립니다.
예제 코드의 package.json에는 강의에서 사용한 lucide-react 버전이 그대로 명시되어 있기 때문에,npm install만 실행하셔도 정상적으로 동일한 환경이 구성됩니다.
다만, 직접 패키지를 설치하실 경우에는 최신 버전이 설치되기 때문에
말씀해주신 것처럼 아이콘이 다르게 보이는 문제가 발생할 수 있습니다.
따라서 위 명령어를 사용하여 버전을 맞춰 진행해주시기를 권장드립니다.
감사합니다.
맞습니다.
실습에서 제공하는 버전에서까지만 SNS 아이콘이 제공되고
이후에는 삭제가 된 것으로 알고 있습니다!
그래서 실습에서도 일부로 버전을 낮춰서 사용하고 있습니다 😀
0
안녕하세요, 인프런 AI 인턴입니다. 5647kr님.
lucide-react 아이콘 패키지를 사용할 때 발생하는 버전 및 아이콘 차이에 대해 문의하셨군요. 일반적으로 npm을 통해 패키지를 설치할 때 최신 버전이 다운로드되며, 이로 인해 강의에서 사용한 버전과 차이가 생길 수 있습니다.
버전 확인 및 설치:
- 패키지의 특정 버전을 사용하려면, npm 명령어에 버전을 명시하여 설치할 수 있습니다. 예를 들어, 과제에서 요구하는 정확한 버전을 사용하려면 아래와 같은 명령어를 활용해 보세요:
npm install lucide-react@특정버전
- 정확한 버전 번호는 강의 자료나 프로젝트 설명서에서 확인할 수 있는 경우가 많습니다.
- 패키지의 특정 버전을 사용하려면, npm 명령어에 버전을 명시하여 설치할 수 있습니다. 예를 들어, 과제에서 요구하는 정확한 버전을 사용하려면 아래와 같은 명령어를 활용해 보세요:
아이콘 차이:
- 같은 패키지라 하더라도 버전 차이로 아이콘의 디자인이 개정되거나, 새로운 아이콘이 추가될 수 있습니다.
- 패키지의
CHANGELOG나README파일을 통해 어떤 변경 사항이 있었는지 확인하실 수 있습니다.
- 같은 패키지라 하더라도 버전 차이로 아이콘의 디자인이 개정되거나, 새로운 아이콘이 추가될 수 있습니다.
문제 해결 방법
패키지 문서 확인: 최신 기능이나 변경된 아이콘이 있는지를 파악하기 위해 lucide-react GitHub 페이지 또는 공식 문서를 참고하세요.
패키지 버전 고정: 프로젝트 시작 시
package.json에 의존성을 명시하고, 다른 사람이 같은 설정으로 개발 환경을 셋업할 수 있도록 버전 번호를 고정합니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다.
현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏
추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.
개인프로젝트를 진행하다보면 제가 원하는 아이콘들이 최신버전에선 많이 안보이더라고요 특히 sns로고 아이콘이 많이 안보이더라고요 근데 미션을 진행하다보니 sns로고도 보이는걸 보고 제가 모르는 다른 lucide-react가 있는줄 알았습니다