Initial load does not scroll to the heading referenced by the document hash

[dcodeIO]

• I confirm that this is an issue rather than a question.

Bug report

Steps to reproduce

Right click and copy the link to a heading, obtaining a link to the page incl. the hash of the respective heading. Close the tab and open the just copied link in a new tab.

What is expected?

Initial load should scroll to the respective heading.

What is actually happening?

Initial load does not scroll to the respective heading.

Other relevant information

• Output of npx vuepress info in my VuePress project:

Environment Info:

  System:
    OS: Windows 10 10.0.18363
    CPU: (16) x64 Intel(R) Core(TM) i9-9900K CPU @ 3.60GHz
  Binaries:
    Node: 14.0.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.17.3 - ~\AppData\Roaming\npm\yarn.CMD
    npm: 6.14.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: 44.18362.449.0
  npmPackages:
    @vuepress/core:  1.5.0
    @vuepress/theme-default:  1.5.0
    vuepress: ^1.5.0 => 1.5.0
  npmGlobalPackages:
    vuepress: Not Found

Workaround

There's probably a better way, but this works for me: Eject theme/layouts/Layout.vue (or any other suitable component) from the default template, and add

  mounted() {
    const hash = document.location.hash;
    if (hash.length > 1) {
      const id = hash.substring(1)
      const element = document.getElementById(id)
      if (element) element.scrollIntoView()
    }
  }

[JoeyBling]

Very good,However if I refresh it immediately, it will sometimes lead to inaccurate positioning. It is not clear whether it is caused by other plug-ins,I had to postpone exec it

    if (hash.length > 1) {
      setTimeout(() => {
        const id = decodeURIComponent(hash.substring(1));
        const element = document.getElementById(id);
        if (element) {
          element.scrollIntoView();
        }
      }, 1000);
    }

[genygilles]

The workaround does not seem to work when using router redirect:

// .vuepress/enhanceApp.js

export default ({ router }) => {
  router.addRoutes([
    { path: '/product/*', redirect: '/product/version/*' }
  ]);
}