NuxtJs Url changes but page no

Question

The NuxtJs app works well with javascript enabled in the localhost and in the server, but I am trying to make it work with Javascript disabled.

I switch to SSR mode, in localhost I can browse all the pages (without javascript) but when I deploy it to the server with npm run build works well with javascript enabled but when I disabled it, the URL changes but the page is reloaded in the home page (no change on the content).

Here is a Github repo of an example: Nuxt App Github repo

Preview of this repo: Preview of the nuxt app

Here is what I get on Network inspector when I try to access for example to Brands page:

Answer 1

You need to see [YOUR-PROJECT]/.nuxt/router.js file of your project which is auto-generated routing. In this file you can find your auto-generated route urls and names. And in nuxt-link, please use route name instead path.

Further information -> https://nuxtjs.org/guide/routing/#basic-routes

also add watchQuery

export default {
 watchQuery: ['page', 'order', 'q']
}

Answer 2

Am using Nuxt 2 and the issue was I was using the fragment npm package on my layouts. After swapping the fragment component with an HTML element e.g. section, nuxt-link now works like a charm.

nuxt-link requires you have only a single parent. But fragment was commenting on the actual DOM. Check your default layout and make sure you are using a single parent.