How to add an image to the vue project in different ways?

I’m expecting to add in image. But none of the ways works.

https://stackblitz.com/edit/vue-fsg2l2?file=src%2Fcomponents%2FHeader.vue,src%2Fcomponents%2FHelloWorld.vue

<a href="#" class="header__top-item facebook" :style="image"></a>
<img alt="" src="../assets/icons/facebook-header.svg" />
<img v-bind:src="require('../assets/icons/facebook-header.svg')" />

 data() {
    return {
      image: { backgroundImage: 'url(../assets/icons/facebook-header.svg)' },
    };
  },
  
  // package.lson
  
  "dependencies": {
    "vue": "^3.2.26",
    "vue-loader": "^17.1.1",
    "vue-svg-loader": "^0.16.0",
    "vue-template-compiler": "^2.0.0",
    "webpack": "^5.0.0"
  },