Improve docs for next export

[shuding]

Discussed in #1197

^{Originally posted by RPDeshaies January 6, 2023}
Hi, I'm currently testing using Nextra in replacement for a Vuepress project I had and I was wondering if it was possible to use the command next build && next export with Nextra?

I've tried running the command and looking at the exported assets, but I'm getting a bunch of 404 of the static assets (js/css/etc)

I initially had an error about using next/images which I fixed by overriding a config in the next config, but I'm not sure at all that's the proper way of doing things.

info  - No "exportPathMap" found in "/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

// next.config.js
const withNextra = require("nextra")({
  theme: "nextra-theme-docs",
  themeConfig: "./theme.config.jsx",
});

module.exports = {
  ...withNextra(),
  images: {
    unoptimized: true,
  },
};

Thanks in advance for the help. And also, Nextra looks absolutely fantastic, I'm really eager to make it work!

[pplonski]

I got the same error and switched image optimization off.

[thekidnamedkd]

I got the same error and switched image optimization off.

Same error as OP. Playing with next config and various solutions, but I suspect something isn't parsing between nextConfig and withNextra() on export.

@pplonski can you share your working config? Thanks!

[pplonski]

I just used:

// next.config.js
const withNextra = require("nextra")({
  theme: "nextra-theme-docs",
  themeConfig: "./theme.config.jsx",
});

module.exports = {
  ...withNextra(),
  images: {
    unoptimized: true,
  },
};

From what I read the yarn next export doesnt work with optimized images.

[thekidnamedkd]

Working for me on non-Vercel & Vercel deploys:

• update build command on line 6 in package.json to:
  "build": "node ./scripts/gen-rss.js && next build && next export"
• update next.config.js to:

const withNextra = require('nextra')(https://github.com/shuding/nextratheme-blog', './theme.config.js')

const nextConfig = {
  images: {
    loader: 'akamai',
    path: '/'
  }
}

module.exports = withNextra(nextConfig)

• set build commands in deploy settings to:
  yarn install && yarn run build