由于图像优化，Nextjs 应用程序不会导出

Question

我看到这个问题，但获得最多支持的答案是使用一些基于 Akamai 的配置，而我不使用 Akamai 托管它。

我有一个 React/Nextjs，其package.json外观scripts如下：

"scripts": {
  "dev": "next dev",
  "build": "next build",
  "start": "next start",
  "lint": "next lint",
  "export": "next export"
},

当我跑步时：

npm run export

我得到：

> myapp-website@0.1.0 export
> next export

info  - using build directory: /Users/myuser/workspace/myappsite/myapp-website/.next
info  - Copying "static build" directory
info  - No "exportPathMap" found in "/Users/myuser/workspace/myappsite/myapp-website/next.config.js". Generating map from "./pages"
Error: Image Optimization using Next.js' default loader is not compatible with `next export`.
  Possible solutions:
    - Use `next start` to run a server, which includes the Image Optimization API.
    - Configure `images.unoptimized = true` in `next.config.js` to disable the Image Optimization API.
  Read more: https://nextjs.org/docs/messages/export-image-api
    at /Users/myuser/workspace/myappsite/myapp-website/node_modules/next/dist/export/index.js:149:23
    at async Span.traceAsyncFn (/Users/myuser/workspace/myappsite/myapp-website/node_modules/next/dist/trace/trace.js:79:20)

当我检查我的next.config.js文件时，我看到：

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  swcMinify: true,
}

module.exports = nextConfig

我需要做什么才能npm run export成功运行？这里发生了什么事？

Answer 1

我也不明白为什么 Nextjs 不能一开始就按原样工作。

我们必须记住的是 Next.js 优化在幕后是如何工作的。镜像在构建过程中并未优化，而是按需优化。当然，为此需要运行服务器。

文档中提到：

图像无法在构建时使用下次导出进行优化，只能按需优化。要将 next/image 与下一次导出一起使用，您将需要使用与默认加载器不同的加载器。在讨论中阅读更多内容。

运行next export并不运行服务器。相反，您尝试从 next.js 项目中导出静态 HTML（例如，在 github 页面等上运行）

next Export 允许您将 Next.js 应用程序导出为静态 HTML，该应用程序可以独立运行，无需 Node.js 服务器。

会有不支持的功能，图像优化就是一个例子。

您可以通过添加以下内容来更改配置next.config.js：

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

或者

module.exports = {
  images: {
    loader: 'imgix',
    path: 'https://example.com/myaccount/',
  },
}

通过使用imgix加载程序，您可以将该任务卸载到 imgix 服务器，它们将为您提供图像。通过在配置中使用unoptimized : true，您将禁用图像优化。这样你就不需要服务器了。