3

I need to convert a non-nextjs page to nextjs. In order to not lose my SEO ranking, I have to create the route with html extension. To make the picture look better, I am adding the folder structure down below.

enter image description here

Unfortunately, this route ending up as 404 on the browser.

enter image description here

What is the problem? Am I allowed to use Next.js routes like that with html extension?

1

2 Answers 2

2

You can do this via the pageExtensions option in nextJS -

I deployed a vercel app to show how this is working

https://html-ext.vercel.app/search-results.html

Steps

  1. Add the pageExtensions to next.config.js files i.e
pageExtensions: ['html', 'jsx', 'js', 'tsx', 'ts'],
  1. Rename the file under pages directory to .html.js - search-results.html.js in this case.
2
  • 3
    Technically, you don't need to add html to pageExtensions. Simply having a file named search-results.html.js under the pages folder would work. Commented Jun 13, 2022 at 17:39
  • Not sure about js, it doesn't work with tsx files
    – Sisir
    Commented Dec 28, 2022 at 12:57
0

This naming convention search-result.html is not allowed for public sub-directories . There are some ways of showing html file in next but I'm not sure they will workcheck this

But you can easily copy everything inside your <body> tag inside your Next js project and it will work properly . How ever you have to manually add your <meta> and other head tags inside Next js built in <Head/> component .

Not the answer you're looking for? Browse other questions tagged or ask your own question.