无法导入本地得图片(Vue中轮播图片)

问题:

可以从图中看出本地图片并没有导进去!!!!

解决:

如果你在 Vue 项目中无法导入本地图片,这通常是由于路径问题 或者webpack 配置不正确导致的。

很明显这跟路径是没有关系的!!!

1. 使用 requireimport 导入图片

require!(AI案例)并没有实践了一下,require也找不到声明什么的,盲猜应该是需要安装一下什么的,觉得麻烦,就用了import导进去!!!!

javascript 复制代码
<script setup>  
import { ref } from 'vue'  
  
const carouselItems = ref([  
  { image: 'https://example.com/image1.jpg', title: 'Title 1' },  
  { image: require('@/assets/imgs/bg.png'), title: 'Title 2' },  
  // ...  
]);  
</script>

!!!!当然了我这里用的是import导入图片

相关推荐
小白冲鸭几秒前
苍穹外卖-前端环境搭建-nginx双击后网页打不开
运维·前端·nginx
wulijuan8886661 分钟前
Web Worker
前端·javascript
深念Y2 分钟前
仿B站项目 前端 3 首页 整体结构
前端·ai·vue·agent·bilibili·首页
IT_陈寒3 分钟前
React 18实战:这5个新特性让我的开发效率提升了40%
前端·人工智能·后端
深念Y8 分钟前
仿B站项目 前端 5 首页 标签栏
前端·vue·ai编程·bilibili·标签栏·trae·滚动栏
老朋友此林12 分钟前
React Hook原理速通笔记1(useEffect 原理、使用踩坑、渲染周期、依赖项)
javascript·笔记·react.js
克里斯蒂亚诺更新14 分钟前
vue3使用pinia替代vuex举例
前端·javascript·vue.js
Benny的老巢24 分钟前
用 Playwright 启动指定 Chrome 账号的本地浏览器, 复用原账号下的cookie信息
前端·chrome
冰暮流星29 分钟前
javascript赋值运算符
开发语言·javascript·ecmascript
2501_9418053135 分钟前
从微服务网关到统一安全治理的互联网工程语法实践与多语言探索
前端·python·算法