uni-app images 下级目录的文件打包时存在丢失的情况

imgages目录下有加了两个文件夹，auth和calculator,打包成h5的时候，imgages下的图片正常打包，auth和calculator这两个目录打包的时候有时候会丢失，求大神指点

vueper 1楼•1 天前作者

cli项目？通过命令行执行的打包h5？

yibo5220 2楼•1 天前

npx degit dcloudio/uni-preset-vue#vite-ts my-vue3-project 生成的，通过jenkins配置命令打包H5，有存在丢失的情况，是jenkins问题？

zlyuanteng 3楼•1 天前

回复 l***@163.com: 手动执行打包h5的命令，有发现生成的目录丢内容吗？

htzhanglong 4楼•1 天前

在使用uni-app进行开发时，如果遇到images下级目录中的文件在打包过程中丢失的情况，这通常是由于配置不当或路径问题导致的。以下是一些可能导致此问题的原因及相应的代码案例，帮助你排查和解决这一问题。

1. 检查 `manifest.json` 配置

首先，确保在manifest.json中正确配置了资源路径。特别是mp-weixin（微信小程序）等平台，需要确保静态资源路径正确无误。

// manifest.json
{
  "mp-weixin": {
    "appid": "your-appid",
    "setting": {
      "urlCheck": false
    },
    "usingComponents": true,
    "permission": {
      "scope.userInfo": {
        "desc": "你的位置信息将用于小程序位置接口的效果展示"
      }
    },
    "resource": {
      "requestDomain": ["your-domain.com"] // 如果有特定的资源域名，请确保配置正确
    }
  }
}

2. 检查文件路径引用

确保在代码中引用的图片路径是正确的。路径应该相对于项目的static目录或pages目录（取决于你的项目结构）。

<!-- 在页面中引用图片 -->
<template>
  <view>
    <image src="/static/images/subdir/your-image.png"></image>
  </view>
</template>

3. 使用绝对路径

在某些情况下，使用绝对路径可以避免路径解析错误。可以通过@符号引用项目的根目录。

<!-- 使用绝对路径引用图片 -->
<template>
  <view>
    <image src="@/static/images/subdir/your-image.png"></image>
  </view>
</template>

4. 检查webpack配置（如适用）

如果你在使用自定义的webpack配置，确保图片文件被正确处理。例如，配置file-loader或url-loader来处理图片文件。

// webpack.config.js
module.exports = {
  module: {
    rules: [
      {
        test: /\.(png|jpe?g|gif|svg)$/i,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: '[path][name].[ext]',
            },
          },
        ],
      },
    ],
  },
};

5. 清理和重建项目

有时候，简单的清理和重建项目可以解决缓存或构建过程中的问题。

# 清理项目
npm run clean

# 重建项目
npm run build