原生微信小程序研发，如何对图片进行统一管理？

最新推荐文章于 2026-02-04 10:28:55 发布

原创

最新推荐文章于 2026-02-04 10:28:55 发布 · 614 阅读

标签

#微信小程序 #小程序

收录于

目标： 统一在配置文件中管理图片，用变量存储，换图标时只需修改链接即可，无需更改业务代码，且方便查找。

tips: 不建议在 asset 中存储大量图片，原因是官方要求小程序内存要限制在2M以内，图片放多了占资源，会扩大包体积。若仅放几个代表性小图标则影响不大。

1. 创建 `config/img` 文件，放置图片链接，方便统一管理

管理图片的cdn链接(或其他链接，只要能加载出图片即可)

// config/image.js 统一管理图片链接
const IMG_BASE_URL = 'https://cdn.example.com/'; // 云存储基础 URL

export default {
   
   
  // 静态图片（直接使用完整 URL）
  IELTSImg: 'https://cdn.example.com/2025/07/07/5c238a94de137ee6bcabefbe1e1fd37a.png',
  defaultLogo:`https://cdn.example.com/2025/07/07/2f32b9151953f0e8caee46b57ac1b3da.png`, // 默认兜底logo
  // 用IMG_BASE_URL 拼接
  logos:{
   
   
	  logo: `${
     
     IMG_BASE_URL}logo.png`,
	  defaultAvatar: