Flutter Web部署后图片不显示：本地正常且目录结构无误

我通过Firebase Hosting部署了Flutter项目的build/web文件夹，相同的部署流程、代码和目录结构在另一个项目中能正常运行，但当前项目部署后图片无法显示。本地环境下图片显示正常，目录结构无误，也已仔细检查过pubspec.yaml文件。

相关截图：

• 目录结构：
• 浏览器报错：
• pubspec.yaml配置：
• 图片引用代码：

• 检查文件名大小写
  Firebase Hosting运行在Linux环境，文件名大小写敏感。如果本地是Windows/macOS（默认不区分大小写），代码里的引用路径和实际文件名大小写不一致的话，本地能正常显示但部署后会报404。对照目录结构和代码里的引用，确保大小写完全匹配。

• 重新构建Web产物
  构建缓存可能导致资源未正确打包，执行以下命令重新生成部署文件：

  flutter clean
  flutter build web
  

  完成后重新部署到Firebase。

• 核对Firebase重写规则
  打开firebase.json，确认重写规则没有拦截图片资源请求。标准的Flutter Web部署规则应该是：

  {
    "hosting": {
      "public": "build/web",
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
      "rewrites": [
        {
          "source": "**",
          "destination": "/index.html"
        }
      ]
    }
  }
  

  该规则只会拦截非静态资源请求，图片等静态文件应能正常访问。如果有自定义规则，确保没有匹配到图片路径。

• 确认图片在构建产物中存在
  部署前检查build/web/assets/images目录，确认目标图片已被正确复制到该目录，且文件名和代码引用一致。部分情况下，构建配置异常会导致资源未被打包进产物。

内容的提问来源于stack exchange，提问作者samuelnihoul