문제

Untitled

로컬에서는 잘 나오나, vercel 배포 시에 이렇게 이미지가 안나오는 문제가 생겼다.

vercel의 문제는 아니었고, vite의 문제였다.

Untitled

다른 곳에 위치하고 있는 이미지들은 잘 나온다.

사람 이미지는 png형태이고, 좌우 화살표는 svg형태이다.

차이점으로는, 안나오는 메뉴 사진들은 svg 형태이며

<img
  :src="`/src/assets/icons/${data.icon}.svg`"
  alt=""
  class="basic-button_icon"
/>

이렇게 v-bind를 하여 배포하고 있다.

배포된 페이지들을 보면, png의 경우

Untitled

이렇게 src가 쓰여있다.

원래 파일은 assets/image/user-01.png이지만 이렇게 변환되어 나왔다.

svg의 경우 base64로 변환되어

Untitled