Nuxt.js: Hash paths in sub-pages routes to `/`

[liyasthomas]

Version

v2.13.0

Reproduction link

https://deploy-preview-971--postwoman.netlify.app/settings

Steps to reproduce

1. Goto https://deploy-preview-971--postwoman.netlify.app/settings
2. Click on any secondary navigation links from sidebar (last 4 icons)

1. <a href="#account"><i class="material-icons">person</i></a> should route to /sub_page#account but instead it transpiled to /#account resulting opening new link.

What is expected ?

Hash paths inside all pages should be relative to current path not / absolute path.

What is actually happening?

<a href="#account"><i class="material-icons">person</i></a> should route to /sub_page#account but instead it transpiled to /#account resulting opening new link.

Additional comments?

This issue was introduced in Nuxt v2.13.0.

I guess it might be related using base path in nuxt.config.js

_{This bug report is available on Nuxt community (#c10822)}

[papertokyo]

Not sure if this is related, but I noticed that hashes in hrefs are getting converted to slashes in the @nuxt/generator module, which can result in 404s during generate/export operation if router.trailingSlash is true, and possibly other cases.

For example, if you have a link that is getting compiled as /blogs/something/# (perhaps because there is an href="#" attr somewhere on the page), the sanitizedHref function will convert that into /blogs/something// and you'll get a bunch of 'Error generating route' errors.

[farnabaz]

This isn't related to Nuxt.
I believe you use router: { base: '/' } in your nuxt-config and Nuxt adds <base href="/"> in you head (or you've added this tag manually). When base tag exists on a page, browser uses its href attribute as base path to resolve relative paths.

In your case, your base href is / and your link is #account and as the result your link refers to /#account but you've excepted /settings/#account

Remove base href I believe you don't need it. Also I recommend using <nuxt-link> instead of <a>.

I close this issue because it isn't related to nuxt, but feel free to reopen it if you have any questions.