微信小程序开发-举例：插入图片

插入本地图片

首先，将图片文件放入 miniprogram\images 文件夹中。

然后在小程序代码编辑窗书写wxml代码,注意图片路径。

<image src="../../images/1.jpg"></image>

caution

注意，小程序中没有<img>标签，因此请使用<image>标签。

插入云图片

小程序对程序包的限制

微信小程序要求在没有分包的情况下，小程序的包大小不超过 2M,因此这就意味着，你不能在小程序文件夹中放过多图片。那么必要的图片都放在哪呢？你可以使用微信的云开发云存储，将文件放到云存储中进行调用(会产生相关费用），或者使用别的图床工具，例如 微博图床 （完全免费）。

在这里，比如我要将图片放入云存储中（云存储的开通合使用将在之后讲解）。

这里有张待添加的图片。我们复制中间的连接，以相同的方式把将其写进wxml代码中。

<image src="cloud://nannan-1g1q4u2i02398ecf.6e61-nannan-1g1q4u2i02398ecf-1311679880/iPhone 13 Pro Max 1.png"></image>

如果使用微博图床。首先将图片上传到图床窗口：

然后复制图片连接，以同样的方式插入wxml代码中。

<image src="https://jetzihan-img.oss-cn-beijing.aliyuncs.com/blog/img/006SHRs9gy1h3p8r4lj5ej30r20iuwm8.jpg"></image>