SSG export routing missing .html

[1jmj]

Bug report

Describe the bug

On an exported site, the routing works via links however the URLs in browser do not get suffixed with .html and therefore if someone wishes to share a link, it does not work.

To Reproduce

Steps to reproduce the behavior, please provide code snippets or a repository:

1. Create next site
2. Create /pages/test.js and add basic content. Add <Link href="/test"><a>Visit test.js</a></Link> on index.js
3. next build && next export
4. Deploy /out folder to static website hosting
5. Visit url. Click Visit test.js
6. Page loads
7. Copy URL
8. Goto new tab in browser and paste URL
9. Page not found error (404)

Expected behavior

Either the route in URL should be .html or the route when copied should work when shared.

System information

• OS: any
• Browser (if applies) any
• Version of Next.js: canary

[bleucitron]

I kind of also have this issue, with dynamic routes.

I use getStaticPaths which builds correctly the exported HTML files:

• /my-dynamic-route-1.html
• /my-dynamic-route-2.html
• ...

But accessing the dynamic page route through the <Link> results in 404.
The path in the browser is /my-dynamic-route-1, which should be fine.

When accessing the page directly with /my-dynamic-route-1.html, it works fine.

[bleucitron]

My bad, in my case, i just misused <Link />.

Having my dynamic pages as [page].js,
<Link href='/[page]' as={href} /> works.
<Link href={href} /> does not.

[shanemacbride]

@iOiurson thank you that fixed my issue as well. Mine was a catch-all route:

<Link href="/blog/[...slug]" as={`/blog/${slug}`}>
  <a>Read</a>
</Link>

[1jmj]

I'm using 'as' ->

<Link href={"/progress/news-articles/[slug]"} as={``/progress/news-articles/${slugify(props.next.title)}``}>

Any thoughts from project team please?

[JollyGrin]

I'm running into similar problems with pages in addition to index requiring .html in order to be visible (for example /test does not work but /test.html does).

I'm not even doing anything fancy, just an additional static page without even any props.

[sbrudz]

@JollyGrin I was having the same issue. I found this StackOverflow post to be very helpful.

I ended up using this solution:

<Link href="/test" as="/test.html">
  <a>Test</a>
</Link>

because having a .html extension for the pages was a requirement for the project I'm working on.

[sovetski]

Same here, and I don't want to get this .html extension in my urls, any idea?