컴포넌트 파일에 파운데이션 라이브러리 연결 안되는 문제

Question

안녕하세요. 25강. 컴포넌트 만들기 전 라이브러리 세팅하기 part를 수강하다가 문제가 있어서 질문드립니다. 질문 1 ] 아래와 같이 파운데이션을 라이브러리에 추가하였는데, 컴포넌트 UI Kit 파일에서 아이콘을 클릭했을때 선생님 강의 화면에는 selection colors에 color/icon/primary로 뜨는데, 제 아이콘 colors에는 그냥 #171717로 색상코드값으로 나옵니다. 질문 2] Apply variables 플러그인 실행하여, 강의 내용대로 실행하였는데 저는 0 variables applied 0s remaining로 하나도 적용이 안되어 있습니다. 혹시 위 질문1번의 문제때문에 안된것일까요? 아래에는 질문과 관련된 화면 캡쳐하여 드립니다.

communityai8509 · Answer

안녕하세요, 인프런 AI 인턴입니다. 미갱이님. 질문하신 현상은 Foundation 라이브러리가 실제로 활성화되지 않았거나, Apply Variables 플러그인에서 라이브러리 변수 대신 로컬 값만 인식하고 있는 경우 발생할 수 있습니다. 아이콘의 색상이 color/icon/primary 가 아닌 #171717 로 표시된다면, 해당 아이콘에 컬러 변수가 연결되지 않은 상태일 가능성이 높습니다. 아래 답변을 먼저 참고해 주세요. UI Kit에서 배리어블 등록 안되는 문제 해당 답변에서는 다음 내용을 안내하고 있습니다. Figma의 Assets → Libraries 에서 BoldPlus Foundation 라이브러리가 활성화되어 있는지 확인 라이브러리 목록에서 해당 항목이 보이지 않는다면 스크롤하여 찾아본 뒤 활성화 Apply Variables 실행 시 라이브러리가 정상적으로 등록되어 있어야 변수 적용 가능 플러그인에 Apply variable name 처럼 자동으로 생성된 항목이 있으면 삭제 후 다시 실행 라이브러리 변수 연결이 정상적으로 되면 #171717 같은 색상 코드 대신 color/icon/primary 와 같은 변수명이 표시됨 참고 이미지: 라이브러리 활성화 확인 이미지 변수 목록 확인 이미지 Apply Variables 설정 확인 이미지 또한 컴포넌트 파일에서 아이콘이나 에셋이 보이지 않는 경우에는 아래 답변도 함께 참고해 보시면 좋습니다. 라이브러리 세팅과 연결 관련 질문드립니다. 이 답변에서는 Foundation 파일은 스타일과 배리어블을 제공하고, 실제 컴포넌트와 아이콘 에셋은 별도의 UI Component Library 파일에서 관리해야 한다고 설명합니다. 따라서 다음 순서로 확인해 보세요. BoldPlus Foundation 2025 라이브러리가 활성화되어 있는지 확인합니다. 컴포넌트 UI Kit 파일에서 라이브러리가 정상적으로 연결되었는지 확인합니다. 아이콘을 선택했을 때 색상 속성이 #171717 로 고정되어 있다면, 해당 아이콘의 Fill에 컬러 변수를 다시 연결합니다. 그 후 Apply Variables 플러그인을 다시 실행합니다. 여전히 0 variables applied 가 표시되면, 플러그인에서 올바른 라이브러리와 컬렉션을 선택했는지 확인합니다. 질문자님의 경우에는 질문 1의 아이콘 색상이 코드값으로 표시되는 문제와 질문 2의 0 variables applied 문제가 서로 연관되어 있을 가능성이 높습니다. 먼저 Foundation 라이브러리 활성화와 아이콘의 Fill 변수 연결 상태를 확인한 뒤 Apply Variables를 다시 실행해 보시는 것이 좋습니다. 저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.