taro 小程序 CoverImage Image src无法显示图片的问题

Dragon Wu2025-05-21 9:33

一、问题描述

使用taro开发的微信小程序图片无法正常显示，并报如下错误：

$渲染层网络层错误$ Failed to load local image resource /assets/icon/message.png

the server responded with a status of 500 (HTTP/1.1 500 Internal Server Error)

此时的代码如下：

javascript 复制代码

      <CoverView>
        <CoverImage src={"/assets/icon/home.png"}/>
      </CoverView>

可以看到，我直接采用了web项目的相对路径写法，直接写路径是有问题的。

二、解决方案

经过查阅资料，了解到小程序项目里图片的src只能是以下两种类型的方式使用：

1、网络在线图片地址；

2、而本地图片，并且在项目中引入以后，

将上面的代码改成正确的方式如下：

javascript 复制代码

import "@/assets/icon/home.png";

......

    <CoverView>
        <CoverImage src={"/assets/icon/home.png"}/>
      </CoverView>

这样在项目中引入以后就OK了！的确是一个比较坑的点。