Ask coding questions

← Back to all posts
Next.js Rewrite Away From Home Page
TalinSharma (77)

Hi.

I am making a project in Next.js and instead of calling my index file index.js, I want to call it Index.js because the case convection fits in with the rest of my pages (they all also start with a uppercase. eg. About.js).

I am trying to do a rewrite in next.config.js but it redirects when I do the home page. For any other page, it works fine but when I try to do this:

module.exports = {
  async rewrites() {
    return [
      {
        source: "/",
        destination: '/Index',
      },
    ]
  },
}

and go to websiteUrl, it redirects me to websiteUrl/Index

I don't want that.

How to fix this?

Thanks!

P.S. Please don't tell me to ignore this and do something else as this is not helpful. Either tell me how to fix this or tell me that is cannot be done. Don't tell me, "Why don't you just leave the name as index.js"... It is annoying and not helpful.

Comments
hotnewtop
RoBlockHead (520)

by convention, your file needs to stay as index.js, as that's just how NextJS works. The rewrites thing works like that because that's what rewrites are for: redirecting from one path to another path. index.js is the file that is used when you go to the root URL. Unfortunately, it's not possible to change these names. Additionally, it might make sense to use lowercase filenames either way, as it's less likely to cause issues with URL paths.