Nuxt 3 setting base url for route path cause to a permenant redirect 301

2 weeks ago 9
ARTICLE AD BOX

I have a Nuxt 3 project where my base url is /travel and the page for that path is in pages/travel/index.vue Also I have another index.vue file in pages folder like this pages/index.vue

In nuxt.config.ts file, I added this to set the base url

app:{ baseURL:'/travel' }

Due to certain conditions (This is a multi tenancy project) I can’t move pages/travel/index.vue content to the pages/index.vue and remove the baseURL.

Now the problem is if a user visits http://localhost:3000/travel I can see 301 redirect and then resolve the page in http://localhost:3000/travel/ path. This cause the SEO issues.

Then I added

app:{ baseURL:'/travel', router: { options: { strict: true } }

And this didn’t worked. Then I created a middleware server/middleware/noBaseSlash.ts and tried this

import { defineEventHandler, send } from 'h3' export default defineEventHandler((event) => { const url = event.node.req.url || '' if (url === '/') { // rewrite to /travel/ event.node.req.url = '/travel/' } })

Both didn’t worked still I can see the re-direct. How to fix this with minimum effort?

Read Entire Article