Vue.js Can'；无法从资产文件夹中获取图像

我有这样的

Vue

组件和

Vuetify

组件：

{{slide.text}
{{ad.title}}
编号{ad.id}}

{{ad.text}}
分享
探索
导出默认值{
数据（）{
返回{
幻灯片：[
{color:'primary'，text:'placeads for free.Forever'，id:1}，
{color:'secondary'，text:'找到您对可接受价格的渴望'，id:2}，
{颜色：'橙色'，文字：'出售垃圾并赚钱'，id:3}，
],
广告：[
{id:1，imageSrc:'@/src/assets/img/ads/1.jpg'，title:'title 1'}，
{id:2，imageSrc:'@/src/assets/img/ads/2.jpg'，title:'title 2'}，
{id:3，imageSrc:'@/src/assets/img/ads/3.jpg'，title:'title 3'}，
{id:4，imageSrc:'@/src/assets/img/ads/4.jpg'，title:'title 4'}，
],
publicPath:process.env.BASE\u URL
}
}
}

图像位于

/src/assets/img/ads

文件夹下。但我得到了一个错误：

[Vuetify] Image load failed

src: /img/ads/4.jpg

我无法想象如何正确计算图像路径？我尝试了很多方法，但都出现了相同的错误-我尝试使用

require

，等等。在官方文档中，我没有找到从资产文件夹加载图像的正确方法。 我使用最新版本的

Vue

和

Vuetify

试试这个

data () {
  return {
//other datas
    ads: [
          { id: 1, imageSrc: require('@/assets/img/ads/1.jpg'), title: 'Title 1'},
          { id: 2, imageSrc: require('@/assets/img/ads/2.jpg'), title: 'Title 2'},
          { id: 3, imageSrc: require('@/assets/img/ads/3.jpg'), title: 'Title 3'},
          { id: 4, imageSrc: require('@/assets/img/ads/4.jpg'), title: 'Title 4'},
        ]
  }
},

试试这个

data () {
  return {
//other datas
    ads: [
          { id: 1, imageSrc: require('@/assets/img/ads/1.jpg'), title: 'Title 1'},
          { id: 2, imageSrc: require('@/assets/img/ads/2.jpg'), title: 'Title 2'},
          { id: 3, imageSrc: require('@/assets/img/ads/3.jpg'), title: 'Title 3'},
          { id: 4, imageSrc: require('@/assets/img/ads/4.jpg'), title: 'Title 4'},
        ]
  }
},

---

如果您构建了整个项目（即npm运行构建），那么您的图像将在哪里结束？我假设dist/img/ads/xx.jpg。您可能遇到了一些网页问题。如果您构建了整个项目（即npm运行构建），那么您的图像最终会出现在哪里？我假设dist/img/ads/xx.jpg。您可能遇到了某些网页问题。