2024-10-24 vue导入图片路径

你是不是经常这么写：

let arr = [
    {
      src: "../../assets/good/1.png",
      }
    ]

然后你发现无法显示图片路径，那是因为你引入的图片路径方式不正确，

如果你的项目是由webpack或者vite构建，那么在导入图片路径的时候会有些许区别。

webpack：

let arr = [
    {
      src: require("../../assets/good/1.png"),
      }
  ]

vite：

let arr = [
    {
      src: new URL("../../assets/good/1.png", import.meta.url).href,
    }
  ];

如果图片路径固定，那么可以直接通过import来导入

import img1 from "../../assets/good/1.png"