<template>
  <div class="p-8">
    <h1 class="text-3xl font-bold">에셋 관리 예제</h1>

    <!-- 1. public 폴더 안의 이미지 (빌드 안 됨, 빠른 서빙) -->
    <div class="my-6">
      <p class="mb-2 text-gray-600">public 폴더의 로고:</p>
      <!-- '/' 경로는 자동으로 public 폴더를 가리킵니다 -->
      <img src="/logo.png" alt="로고" class="w-32" />
    </div>

    <!-- 2. app/assets 폴더 안의 이미지 (빌드 됨, 해시값 부여) -->
    <div class="my-6">
      <p class="mb-2 text-gray-600">assets 폴더의 아이콘:</p>
      <!-- '~/assets' 경로는 빌더(Vite)가 찾아서 처리해 줍니다 -->
      <img src="~/assets/icons/star.svg" alt="별" class="w-16" />
    </div>
  </div>
</template>