Issue with Static Export in Next.js Not Generating index.html for Directory Routes (App Router)
Answered
Tibetan Mastiff posted this in #help-forum
Tibetan MastiffOP
Hi,
I'm encountering an issue with Next.js where my static export process is not generating index.html files for certain directory routes. Specifically, I have a directory named designs with a page.tsx inside it, and I expected Next.js to generate an index.html in the out/designs folder upon export. However, this is not happening.
Here's the structure of my pages directory:
After running next export, the out folder has a site-notice.html as expected, but there's no index.html in the out/designs folder. Instead, I only see HTML files for dynamically generated routes like letter-a-shirt.html.
Here's what the out/designs directory looks like after export:
I've tried various configurations in next.config.js, including setting trailingSlash: false, but the issue persists. I'm not sure if I'm missing a configuration step or if this is a bug with Next.js.
Has anyone else faced this issue, or does anyone have insights on how to ensure index.html is generated for directory routes during the static export process?
Any help or guidance would be greatly appreciated!
I'm encountering an issue with Next.js where my static export process is not generating index.html files for certain directory routes. Specifically, I have a directory named designs with a page.tsx inside it, and I expected Next.js to generate an index.html in the out/designs folder upon export. However, this is not happening.
Here's the structure of my pages directory:
/pages
/designs
page.tsx
/site-notice
page.tsxAfter running next export, the out folder has a site-notice.html as expected, but there's no index.html in the out/designs folder. Instead, I only see HTML files for dynamically generated routes like letter-a-shirt.html.
Here's what the out/designs directory looks like after export:
/out
/designs
letters.html
...I've tried various configurations in next.config.js, including setting trailingSlash: false, but the issue persists. I'm not sure if I'm missing a configuration step or if this is a bug with Next.js.
Has anyone else faced this issue, or does anyone have insights on how to ensure index.html is generated for directory routes during the static export process?
Any help or guidance would be greatly appreciated!
Answered by Tibetan Mastiff
OK I found the solution:
const nextConfig = {
output: 'export',
images: { unoptimized: true },
trailingSlash: true,
}
module.exports = nextConfig;
By setting "trailingSlash" to "true", ithen generates all the folders.
const nextConfig = {
output: 'export',
images: { unoptimized: true },
trailingSlash: true,
}
module.exports = nextConfig;
By setting "trailingSlash" to "true", ithen generates all the folders.
1 Reply
Tibetan MastiffOP
OK I found the solution:
const nextConfig = {
output: 'export',
images: { unoptimized: true },
trailingSlash: true,
}
module.exports = nextConfig;
By setting "trailingSlash" to "true", ithen generates all the folders.
const nextConfig = {
output: 'export',
images: { unoptimized: true },
trailingSlash: true,
}
module.exports = nextConfig;
By setting "trailingSlash" to "true", ithen generates all the folders.
Answer