Vue3+TS图片路径不对问题求助
本帖最后由 qadan 于 2024-4-12 20:31 编辑vitevue3项目，dev运行图片路径是：vue3根目录/public/static/icon/1.png
根据category的值去匹配路径的图片
build打包后路径是：abc.com/public/static/icon/0.png，正确应该换成abd.com/admin123/static/icon/0.png
如果直接把public换成admin123，run dev运行又不行了
我是这样写的，图片的名称需要动态的
<div style="display: flex; align-items: center" v-else>
<img style="width: 27px" :src="getIconSrc(scope.row.category)"/>
</div>
如果直接写死没问题，动态的路径就不行
————————————————————
举个例子，vue前端404页面有个图片，打包后就没问题，但是我的代码图片是动态的（参考下图），根据索引来获取图片，我试过把图片路径写死就不会报错，如果是动态路径就报错
总结：本地运行可以，部署到云上路径就出错，找不到图片
______2024年4月12日20:31:41更新
上面两个图片是代码写死的，路径如下，无法显示的图片是动态的index索引，admin123是yarn run build加上的后端路径
abc.com/admin123/static/icon/0.png代码写死的
abc.com/public/static/icon/6.png,6数字是动态的
本帖最后由 hejian0301 于 2024-4-12 18:45 编辑
读一下文档，生产环境不支持动态url；
看你描述，应该没有配置base，但是没明白admin123又是哪来的？
我认为，不需要使用 new URL。
如果没有配置base，直接`/public/static/icon/${index}.png`
如果配置了base: admin123，`/admin123/public/static/icon/${index}.png`
最好贴一下vite配置； 貌似打包的时候 有个publicPath 查一查 zhangzan0224 发表于 2024-4-12 17:13
貌似打包的时候 有个publicPath 查一查
应该不是这个问题，举个例子，vue前端404页面有个图片，打包后就没问题，但是我的代码图片是动态的，根据索引来获取图片，我试过把图片路径写死就不会报错，如果是动态路径就报错 你这个“正确应该换成abd.com/admin123/static/icon/0.png” 是怎么来？，怎么打包怎么部署就可以啊！干嘛要把这个文件路径名称给改了？？？，是用nginx部署的吗？是nginx 代{过}{滤}理 admin123 到 public 路径下了？还是 public 被占用了？
“如果直接把public换成admin123” 那肯定不行啊。 mr88fang 发表于 2024-4-12 17:15
你这个“正确应该换成abd.com/admin123/static/icon/0.png” 是怎么来？，怎么打包怎么部署就可以啊！干嘛 ...
后端thinkphp框架，运行路径public，不需要public这个目录，而打包后的vue正在admin123目录 qadan 发表于 2024-4-12 17:16
后端thinkphp框架，运行路径public，不需要public这个目录，而打包后的vue正在admin123目录
你贴一下打包后目录结构是怎么样的，或者写一下 是不是<script setup>没有抛出这个变量。在这种模式下变量不可见。需要手动抛出 看你的示例代码里面更本没有admin123这个文件夹？？？？这个文件夹哪里来的？ 啊笨 发表于 2024-4-12 18:55
看你的示例代码里面更本没有admin123这个文件夹？？？？这个文件夹哪里来的？
yarn run build 打包后的路径是后端域名/admin123
页:
[1]
2