导入的图像不是有效的图像文件

Question

概括

我应该期望我的 expo-react-native + nextjs 应用程序在安装并添加“next-images”插件后构建，就像文档所说的那样，但在构建时我被 7 次出现相同的错误所阻止：

“错误：图像导入“./assets/X.png”

不是有效的图像文件。图像可能已损坏或格式不受支持。”此错误不仅出现在我自己的代码中，还出现在我安装的软件包（特别是反应导航）中的代码中

＃＃＃ 环境

expo-env-info 1.0.5 环境信息：系统：操作系统：Linux 5.15 Debian GNU/Linux 11（牛眼）11（牛眼）外壳：5.1.4 - /bin/bash 二进制文件：节点：16.17.0 - /usr/ local/bin/node Yarn: 1.22.19 - /usr/local/bin/yarn npm: 8.15.0 - /usr/local/bin/npm Watchman: 20220528.183901.0 - /usr/local/bin/watchman npmPackages: expo ： ^47.0.0 => 47.0.8 反应：18.1.0 => 18.1.0 反应-dom：18.1.0 => 18.1.0 反应本机：0.70.5 => 0.70.5 反应本机网络： ~0.18.7 => 0.18.10

Expo Workflow: managed

请指定您的设备/仿真器/模拟器平台、型号和版本

ChromeOS 版本 102.0.5005.189（官方版本）（64 位）和 CodeSandbox 项目：最新浏览器版本

错误输出

@react-navigation/elements:154 错误：图像导入“./assets/back-icon-mask.png”不是有效的图像文件。图像可能已损坏或格式不受支持。

./AppbarBackIcon:66 错误：图像导入“../../assets/back-chevron.png”不是有效的图像文件。图像可能已损坏或格式不受支持。

你明白了

可重现的演示或从空白项目重现的步骤

链接到 repl。这个 repl 是我的开发环境，删除了我的所有代码。repl 应该在启动时自动运行。如果没有，运行命令

cd north-sea-native-next/north-sea/next && yarn next dev

并等待页面构建并出现错误

Answer 1

由于我使用的是 Next/images 插件，因此 nextjs 配置对我有用

// @generated: @expo/next-adapter@2.1.52
// Learn more: https://docs.expo.io/guides/using-nextjs/

const { withExpo } = require("@expo/next-adapter");
const withPlugins = require("next-compose-plugins");
const withImages = require("next-images");
const withFonts = require("next-fonts");
const withTM = require("next-transpile-modules")(["react-native-web"]);

const nextConfig = {
  images: {
    disableStaticImages: true,
  },
};

module.exports = withPlugins(
  [withTM, withExpo, withImages, withFonts],
  nextConfig
);

这是我的 github 问题

这就是我找到答案的地方（史蒂文·马修斯）

注意：这是我的 React Native Web + nextjs 项目。它应该可以工作，但如果不行我不知道该怎么办