Vue3+Vite img src dynamic binding

<img :src="diary.awayTeamImg" alt="">

This does not work in Vue. When I use that source in static src, it works.

So I searched how to use src with dynamic binding.

There were 2 ways.
1. use required();
-> this doesn't work while using Vite.............................

2. use URL

<template>
  <img
          :src="getAwayImg('../..' + diary.awayTeamImg)"
          :alt="diary.awayTeamImg"
          style="width: 50px"
  />
</template>

<script setup>

	const getAwayImg = (path) => {
    	return new URL(`${path}`, import.meta.url).href;
 	};
</script>

This worked.