发布微信小程序时，uni-app中image的src编译为（unknown）

发布微信小程序时，uni-app中image的src编译为（unknown）

产品分类：

uniapp/小程序/微信

PC开发环境操作系统：

Windows

PC开发环境操作系统版本号：

win11

第三方开发者工具版本号：

Stable 1.06.2412050

基础库版本号：

3.7.4

项目创建方式：

CLI

CLI版本号：

3.0.0-4040520250104002

示例代码：

<view>
  <image v-for="i in 4" :key="i" src="@/static/star.png"></image>
</view>

.level {  
  height: 100rpx;  
  width: 30rpx;  

  position: absolute;  
  bottom: 195rpx;  
  right: 0;  
  display: flex;  
  flex-direction: column;  
  align-items: center;  

   image {  
    margin-top: 6rpx;  
    width: 15rpx;  
    height: 15rpx;  
  }  
}

操作步骤：

h5运行正常，打包发布小程序后不显示星星

预期结果：

正常显示星星图片

实际结果：

没有显示星星图片

bug描述：

image标签原本应该是正常路径，结果变成了（unknown）。其他地方的image都正常。 h5正常，测试不使用循环也正常。

Image 1 Image 2 Image 3

Me.zip


更多关于发布微信小程序时，uni-app中image的src编译为（unknown）的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于发布微信小程序时，uni-app中image的src编译为（unknown）的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是一个典型的微信小程序路径编译问题。在微信小程序环境中，@/static/这样的路径别名可能无法正确解析。

解决方案：

  1. 修改图片路径为相对路径：
<image v-for="i in 4" :key="i" src="../../static/star.png"></image>
  1. 或者使用绝对路径（从项目根目录开始）：
<image v-for="i in 4" :key="i" src="/static/star.png"></image>
  1. 如果图片需要动态引用，可以使用require：
<image v-for="i in 4" :key="i" :src="require('@/static/star.png')"></image>
回到顶部