在“next.config.js”中找不到“exportPathMap”。从“./pages”生成地图

Question

将 Next.js 部署到 Netlify 时出现此错误。

Error: Image Optimization using Next.js default loader is not compatible with `next export`.

Possible solutions:

6:47:15 AM:   - Use `next start`, which starts the Image Optimization API.
6:47:15 AM:   - Use Vercel to deploy, which supports Image Optimization.
6:47:15 AM:   - Configure a third-party loader in `next.config.js`.
6:47:15 AM:  -  Read more: https://err.sh/next.js/export-image-api.
6:47:15 AM:   at exportApp (/opt/build/repo/node_modules/next/dist/export/index.js:14:712)

部署到 Vercel 时不会出现此问题。

Answer 1

使用akamai

设置images.loader导致'imgix'开发和构建错误。

我用这个代替：

// next.config.js

module.exports = {
  images: {
    loader: 'akamai',
    path: '',
  },
}

它只适用于我关心的一切。

可能的值为images.loader：[default、imgix、cloudinary、akamai、custom]
参考： https: //nextjs.org/docs/pages/api-reference/components/image-legacy#built-in-loaders

Answer 2

从 Next.js 12.3 开始，您可以使用中的配置完全禁用next/image图像优化。这避免了在使用时必须使用第三方提供商来优化图像。unoptimizednext.config.jsnext/export

从next/image文档中：

unoptimized- 如果为 true，源图像将按原样提供，而不是更改质量、大小或格式。默认为false.

module.exports = {
    images: {
        unoptimized: true
    }
}

在 Next.js 12.3 之前以及从 12.2 开始，该unoptimized配置仍处于实验阶段，可以在该标志下启用experimental。

module.exports = {
    experimental: {
        images: {
            unoptimized: true
        }
    }
}

Answer 3

我在使用命令时遇到了同样的问题next export。我仍然收到此错误：

错误：使用 Next.js 的默认加载器进行图像优化与next export. 可能的解决方案：

• 用于next start运行服务器，其中包括图像优化 API。
• 使用任何支持图像优化的提供商（如 Vercel）。
• 在 中配置第三方加载器next.config.js。
• 使用loader的道具next/image。

因此，为了使我的自定义加载程序正常工作，我需要设置空字符串的路径：

module.exports = {
  // https://github.com/vercel/next.js/issues/21079
  // Remove this workaround whenever the issue is fixed
  images: {
    loader: 'imgix',
    path: '',
  },
}

但是，当我打开生成的index.html文件时，没有加载任何图像或 JS。

因此，对于那些也面临这个问题的人，请尝试将路径设置为/这样：

module.exports = {
  // https://github.com/vercel/next.js/issues/21079
  // Remove this workaround whenever the issue is fixed
  images: {
    loader: 'imgix',
    path: '/',
  },
}

Answer 4

似乎您使用下一个/图像。但next/images不要与静态页面（与生成的工作next export）对于静态页面中使用这个图像优化：下一个优化的图像，而不是