微信小程序开发引用静态资源图片报错解决

微信小程序开发引用静态资源图片报错解决

1、问题项目背景

使用微信小程序云开发、vant UI搭建简易项目中引用静态图片报错，引用报错代码及报错信息如下图：

2、问题原因

• 如上图中红色方框中，第一种相对路径报错原因

因为image组件是使用的vant组件库中的组件，虽然使用带看pages目录下，但在你使用相对路径时，它仍然会去vant组件库目录下开始找。

如需使用相对路径方式，可根据项目结构多返回几层，（以我的项目结构来说如下）

• 如上图中红色方框中，第二种绝对路径报错原因

绝对路径来说，返回的根目录就是miniprogram目录，因此使用绝对路径只需要直接给/images/XXX.png即可