2nd/10_Wiki/Topics/2026-04-26-Skybound_Player_Sprite_Path_Warning_Fix.md

Skybound Player Sprite Path Warning Fix

작성일: 2026-04-26 12:11 KST

요청 요약

• npm run build 시 반복되던 /sprites/player.png referenced in /sprites/player.png didn't resolve at build time 경고를 해결한다.
• 필요하다면 Skybound의 Stylized Casual Magitech 톤앤매너에 맞는 플레이어 기체 이미지를 새로 준비한다.

원인

경고의 원인은 실제 플레이 중 사용되는 Canvas 렌더링이 아니라, 선택 화면 CSS에서 존재하지 않는 /sprites/player.png를 참조하고 있었기 때문이다.

문제 위치는 src/App.css의 아래 클래스였다.

• .plane-preview.falcon
• .plane-preview.rayce

현재 프로젝트에는 /sprites/player.png가 없고, 실제 준비된 기체 에셋은 아래 파일이다.

• /sprites/Falcon.png
• /sprites/rayce.png

따라서 새 이미지를 생성하기보다, 이미 톤앤매너에 맞춰 준비된 실제 기체 에셋으로 경로를 정리하는 것이 적절했다.

적용한 변경

Falcon 미리보기 경로 수정

/sprites/player.png를 /sprites/Falcon.png로 교체했다.

Rayce 미리보기 경로 수정

Rayce도 같은 player.png에 hue-rotate를 걸어 임시로 표현하고 있었기 때문에, 실제 /sprites/rayce.png를 직접 사용하도록 바꿨다.

또한 임시 색상 변환 필터를 제거했다.

설계 의도

선택 화면은 사용자가 처음 기체의 정체성을 보는 곳이기 때문에, 존재하지 않는 공용 player.png나 임시 색상 변환보다 실제 기체별 에셋을 보여주는 편이 상품성 측면에서 낫다.

이번 수정으로 다음 효과가 있다.

• Vite 빌드 경고 제거
• Falcon/Rayce 선택 화면 미리보기 정확도 개선
• 임시 에셋 참조 제거
• 기존 Stylized Casual Magitech 기체 에셋 재사용

수정 파일

• /Volumes/Data/project/Antigravity/Skybound/src/App.css

검증

• npm run build 성공
• 기존 /sprites/player.png Vite 경고 사라짐
• 출력 디렉터리: dist/21

후속 작업 제안

• 선택 화면의 기체 미리보기를 정적 배경 이미지가 아니라, Canvas 렌더러와 동일한 축소 프리뷰 컴포넌트로 통일한다.
• Falcon/Rayce의 실제 플레이 성능 차이가 UI 문구와 정확히 대응되는지 점검한다.
• 선택 화면도 현재 게임 HUD/UI 톤과 완전히 맞도록 한 번 더 정리한다.