Links are incorrect after refresh page

[nam-hle]

🐛 Bug Report

Prerequisites

• I'm using the latest version of Docusaurus.
• I have tried the npm run clear or yarn clear command.
• I have tried rm -rf node_modules yarn.lock package-lock.json and re-installing packages.
• I have tried creating a repro with https://new.docusaurus.io (There is no issue with it)
• I have read the console error message carefully (if applicable)

Description

Links in doc pages that refer to another doc are wrong.

For example:
When I'm in doc page A has link /docs/current-doc which contains:

[other doc][doc reference]

[doc reference]: other-doc-file

At the first time, when hover other doc, the link is /docs/other-doc-file => true.

But, after reloading page, the current URL is appended with trailing slash: ``/docs/current-doc/. And the reference link will become /docs/current-doc/other-doc-file` => 404 page.

Note that the issue is only in the production, neither in the local build nor in the sandbox.

Have you read the Contributing Guidelines on issues?

Yes

Steps to reproduce

Use https://new.docusaurus.io to create a CodeSandbox reproducible demo of the bug.

(Write your steps here:)

1. Go to https://wiki.polkadot.network/docs/getting-started
2. Move the mouse to 'Creating a Polkadot Account', verify the link is https://wiki.polkadot.network/docs/learn-account-generation/, which is correct.
3. Refresh the page, the URL will become https://wiki.polkadot.network/docs/getting-started/ (has trailing slash)
4. Move the mouse to 'Creating a Polkadot Account' again, verify the link is https://wiki.polkadot.network/docs/getting-started/learn-account-generation, which is deadlink.

Expected behavior

It will go to the right page: https://wiki.polkadot.network/docs/learn-account-generation

Actual behavior

It goes to the wrong page: https://wiki.polkadot.network/docs/getting-started/learn-account-generation

Your environment

• Public source code: https://github.com/w3f/polkadot-wiki
• Public site URL: https://wiki.polkadot.network/
• Docusaurus version used: 2.0.0-beta.3
• Environment name and version (e.g. Chrome 78.0.3904.108, Node.js 10.17.0): Firefox 89.0.2 (64-bit), Node.js 14.17.0
• Operating system and version (e.g. Ubuntu 20.04.2 LTS): macOS Catalina 10.15.6

Reproducible demo

Use https://new.docusaurus.io to create a CodeSandbox reproducible demo of the bug.

(Paste the link to an example repo, including a docusaurus.config.js, and exact instructions to reproduce the issue.)

[slorber]

This is a trailing slash issue. Your host is adding a / at the end of URLs, leading relative links to be resolved differently.

Afaik you are using Netlify for this site (which adds trailing slashes due to the prettyUrls option).

For Netlify, we now recommend to either disable pretty-URLs, or to use an explicit trailingSlash config:

• https://docusaurus.io/docs/deployment#trailing-slashes
• https://docusaurus.io/docs/deployment#deploying-to-netlify

Also you should prefer linking docs using relative file paths instead of using relative paths. We don't process relative paths and thus they become sensitive to such trailing slash issues, but it wouldn't be the case if you used [start](getting-started.md) for example.

• https://docusaurus.io/docs/docs-markdown-features#referencing-other-documents

[nam-hle]

Thank you for so quick response. We're using Github Pages for hosting. I guess using file extension could fix it 😄

[slorber]

Let me know if it works for you, this is a new reco we give

Even if you fix the linking issue and don't have 404 anymore, you still want to fix the trailing slash issue, because it has a potential SEO impact (your canonical URL does not contain /, so the URL without / shouldn't perform any server-side redirect)