Vite图片路径

只需要引入单个图片

<template>
              <el-image
                  :src="example"
                  :preview-src-list="[example]"
                  :initial-index="0"
                  fit="cover"
              />
</template>

<script>
import example from "@/assets/example.png";

export default {
 setup(){
    return{
    example
    }
 }
}
</script>

动态引入图片

此方法推荐

export default const getAssetsFile = (url: string) => {
   return new URL(`../assets/images/${url}`, import.meta.url).href
}

<img :src="getAssetsFile('/home/home_icon.png')" />

CSS中引入图片

需要使用相对路径

.imgText {
  background-image: url('../../assets/example.png');
}

---

👉推荐！！！【腾讯云】爆款2核4G云服务器首年74元/年

👉推荐！！！【腾讯云】1核2G5M轻量应用服务器50元/年

【腾讯云】云数据库低至9.9/年！MySQL7.4元/月

【阿里云】ECS云服务器特惠

【阿里云】服务器首购优惠

如果文章对您有帮助，扫个红包码呗