- 使用vue3版本
- 使用分包，在分包下 创建 static 文件夹
- 在分包页面引入 第二步 创建的 static 下面的图片 (../static/xx.png)
孤竹
- 发布：2023-04-15 15:07
- 更新：2025-07-31 20:38
- 阅读：1340
产品分类： uniapp/小程序/微信
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： win11
HBuilderX类型： 正式
HBuilderX版本号： 3.7.9
第三方开发者工具版本号： 1.06.2303220
基础库版本号： 2.31.0
项目创建方式： HBuilderX
操作步骤：
预期结果：
正常显示图片 路径为 ../static/xx.png
正常显示图片 路径为 ../static/xx.png
实际结果：
图片未显示 路径为 /static/xx.png
图片未显示 路径为 /static/xx.png
bug描述：
vue3版本下 在分包 使用 图片 路径为 ../static (分包下面的 static) , 微信小程序会把路径识别为 /staic
vue2 版本都正常
vue3 版本 h5正常 微信小程序异常 app未测试
最佳回复
/**
* 获得当前组件下的分包资源
* @param p static下的父级路径
* @param avatar 文件名，或相对分包static的相对路径名
*/
export function _staticPath (p = '', avatar){
let path = `/pages-A/static${p}/${avatar?avatar:'def.svg'}`;
// 兼容h5
// #ifdef H5
path = `/@${path}`;
// #endif
return path;
}每个分包下做一个这样的函数，需要用分包私有static图片资源的就用函数获取，函数内进行h5兼容处理，默认是微信小程序分包资源获取逻辑。
<image :src="_staticPath('','details.png')" />
