Vue NuxtJS 自定义图像标签未加载我的 src

Question

我想在 NuxtJS 中创建一个自定义图像组件（以传递 rgb 颜色并自动为图像着色），但是当我的 CustomImage 组件中的 img 获得传递的路径时，它会加载我的图像，但我无法正常工作.

错误：

logotext.png:1 GET http://localhost:8080/@/assets/images/logotext.png 404 (Not 
Found)

我的自定义图像：

<template>
  <img  :src="src" :alt="alt" />
</template>

<script lang="ts">
import Vue from 'vue';
import { Component, Prop } from 'nuxt-property-decorator';

@Component({})
export default class CustomImage extends Vue {
  @Prop({
    type: String,
    required: true,
  })
  public src!: string;
  @Prop({
    type: String,
    required: true,
  })
  public alt!: string;
}
</script>

Answer 1

在 static 目录中创建一个名为 images 的文件夹，并将您的图像移动到其中，然后按如下方式使用它们：

 <CustomImage src="/images/logotext.png" alt="Logo" />

/指的是静态目录。

查看this了解更多详情

Vue NuxtJS 自定义图像标签未加载我的 src

Vue NuxtJS custom image tag not loading my src

javascript

typescript

vue.js

vuejs2

nuxtjs