Vue-3 + Typescript Type '{ backgroundImage: string; }' is not assignable to type 'string'

Question

I want to build and deploy Vue3 + Typescript application. I am using Vite and when I try to build the application I am getting an error.

vue-tsc --noEmit && vite build
error TS2322: Type '{ backgroundImage: string; }' is not assignable to type 'string'.46       :src="image"

my folders for my vue3 application is as below:

./spine-frontend
..../src
--------/assets
----------/img
--------/views
----/public

and I am trying to use it my image as data:

<template>
  <div class="absolute top-0 right-0 block w-9/12 h-full">
    <img
      alt="Snowy mountain lake"
      class="object-cover min-w-full h-full"
        <div class="absolute top-0 right-0 block w-9/12 h-full">
          <img
            alt="Snowy mountain lake"
            class="object-cover min-w-full h-full"
            :src="image"
          />
        </div>
      />
  </div>
</template>
<script lang="ts">
export default {
    name: 'Home',
    data() {
        return {
            image: { backgroundImage: "url(static/img/hero-image.jpg)" }
        }
    }
}
</script>

Can you help me to use vue3/vite way to render my images while build?

Thanks