Search code examples
reactjsdocusaurus

Get link depending on selected language in Docusaurus

I have activated i18n on the website generated with Docusaurus. How can I get the internal link depending on the user's language on GUI?

E.g. I would like to navigate to /docs when the button is clicked. If the default language en is active, then it should return /docs, but in the case of fr it must return /fr/docs.

Solution

  • For getting link depending on selected language one can use docusaurus useBaseUrl Hook, which prepend sites baseUrl to string (i.e. link). E.g.:

    import useBaseUrl from '@docusaurus/useBaseUrl';
...
// if e.g. fr selected i18nLink="/fr/docs", otherwise i18nLink="/docs"
const i18nLink = useBaseUrl('docs');