ionic vue 无法从资产文件夹中选择图像？

Question

在我的 ionic vue 项目中，我在多个地方使用图像显示。它无处不在，但我知道我在资产文件夹中又添加了一张图片，但 ionic 完全无法加载该图片

<template>
  <IonPage>

    <ion-content :fullscreen="true" id="start">

      <div id="background">

        <Topbar />

        ARCTICS PRO PRODUCT PAGE

  <div> <img src="/assets/bottom_kurve.png" ></div>
      </div>

    </ion-content>

  </IonPage>
</template>

<script lang="ts">
import { IonContent, IonPage  } from '@ionic/vue';
import Topbar from '../Resources/Topbar.vue';
import { useRouter } from 'vue-router';

export default  {
  name: 'Index',
  components: {IonContent, IonPage, Topbar },
  setup() {

    return {
      router: useRouter(),
    }
  }
}
</script>

这个组件名称是 Product.Vue

Product.vue位置

C:\Users\bilal\Downloads\arcadeapp\arcadeapp\src\views\Shop\Product.vue

图片路径

C:\Users\bilal\Downloads\arcadeapp\arcadeapp\dist\assets\bottom_kurve.png

Answer 1

代替：

<img src="/assets/bottom_kurve.png" ></div>

试试：

<img :src="require('@/assets/bottom_kurve.png')" ></div>

@/ 是您项目的 src 文件夹。