模块解析失败：带有 vuetify 加载程序的图像中出现意外字符“�”

Question

我花了几个小时试图在我的 vuetify 网站上加载一张 static 图片。 我在 v-toolbar 中有以下代码：

<template class="d-flex align-center">
            <v-img
                :alt="appName"
                class="shrink mr-2"
                contain
                :src="require('./../static/images/logo64.jpg')"
                transition="scale-transition"
                width="40"
            />
</template>

它不想加载它。 我的 package.json 文件中的 devDependencies 中有 sass、sass-loader、style-loader 和 vuetify-loader，除此之外，我的所有代码都可以与 vuetify、vue 和 vuex 一起正常工作。

这是完整的错误：

我忘记做某事了吗？

Answer 1

您是否尝试过完全不同的 jpg？ 此外，检查文件扩展名是否为小写，始终使用 .jpg 而不是 .JPG

编辑：如果可以的话，请发布完整的错误消息...

edit2：错误很明显，您没有加载程序来处理图像文件。
首先尝试安装 file-loader ，如果不能解决问题，请检查您的 webpack.config，可能缺少以下部分（或不包括 jpg）：

{
  test: /\.(png|jpg|gif|svg)$/,
  loader: 'file-loader',
  options: {
  name: '[name].[ext]?[hash]'
}