vue.js - 在 vue 3 中使用 vite 引用数据属性或方法中的资产

Question

我刚开始使用 Vue 3 和 vite，一切都在开发中运行良好。但是，当我为生产构建应用程序时，数据属性中声明的资产被忽略并在生产构建中抛出 404。这是数据对象的样子......

data() {
    return {
      testimonials: [
        {
          customer_name: "John Doe.",
          comment: "Some customer comment here...",
          image: "/src/assets/img/awesome_customer.png",
        },
        ...
      ]
    }
}

将资产作为"/src/assets/img/awesome_customer.png"模板标签和生产中的作品引用会正确捆绑它，但如果它在数据属性或方法中使用则不会。

使用 vue-cli，我们将使用，require()但我还没有设法让它在 vite 中工作关于如何实现这一点的任何想法？

更新：我在这里设置了一个示例存储库来演示所指的内容。自述文件包含重现的步骤。

Answer 1

升级到 vite 2.0 并导入图像而不是直接在数据对象中引用它们解决了这个问题。虽然我想知道是否有更好的方法。

您可以在此处关注讨论