How to set docs as homepage for Docusaurus

If you'd prefer to show the Docusaurus docs section as a homepage instead of the regular landing page, you can use the snippet below.

There are several ways to do this. From a simply server redirect, to the a hacky JavaScript redirect to the much desired official approach down below.

Official solution: configure the docs plugin

Follow these 3 steps:

1. Set a document with a slug /

Create the markdown file you want as homepage inside /docs/ and set the slug to /

---
id: my-home-doc
slug: /
---

My home doc content....

2. Set the docs plugin to /

In your docusaurus.config.js add routeBasePath: '/'

presets: [
  [
    '@docusaurus/preset-classic',
    {
      docs: {
        routeBasePath: '/',Code language: JavaScript (javascript)

3. Delete the single.js file

Find the following file and delete it:

./src/pages/index.js

Check out the documentation for Docs-only mode.

Hack: use a redirect

The initial version of this post I pointed out that you could replace the file contents of src/pages/index.js with this:

import React from 'react';
import  { Redirect } from 'react-router-dom';

export default function Home() {
  return <Redirect to='/docs/intro' />;
}Code language: JavaScript (javascript)

While this works it's an unnecessary redirect given the out of the box solution described above.

This was tested on Docusaurus 2.0.0

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *