Vue.js & Laravel - 无法加载新图像文件，但可以加载旧图像

Question

我正在开发一个 Vue.js 和 Laravel 项目，其中 Vue 位于 Laravel 项目的 resources/js 目录中。

我在加载刚放在 resources/js/assets 目录中的图像时遇到问题。我使用的是模板，所以文件夹中的图像已经很少，当我尝试加载刚放入的新图像文件时，图像不会被加载。但是当我试图加载另一个图像（目录中的旧图像）时，图像出现了。我正在尝试将图像添加为页面的背景图像。这是我的代码。

HTML:

<div class="page-header align-items-start min-vh-100" :style="{ backgroundImage: 'url(' + bgImage + ')' }">

Vue（JS）：

export default {
    name: "login",
    data() {
        return {
            bgImage: "/assets/img/office-dark.jpg"
        };
    }

我尝试了每一个新的图像文件，这就是问题发生的时候（没有错误，只是图像无法加载）。旧图像文件没问题。有什么建议吗？

Answer 1

看看这里，往往require是个不错的选择

Link:

Vue.js & Laravel - New Image file cannot be loaded but the older image can