I recently run into an HTTP 404 error when calling /docs on my Docusaurus websites. This isn't actually nice, because I expected to land on my documentation entry page e.g. introduction. First I thought, perhaps this is an issue with my setup. But I found out that even the Docusaurus website itself is suffering from this issue as well. So I tried to find a solution on the internet. But I couldn't find anything except an issue on github describing the same behavior. So, with this article I try to help everyone saving their time and making the experience with Docusaurus even better.
So here is my solution.
- Go to your
website\siteConfig.js
file and update the entry doc link in theheaderLinks
section by addinghref: "/docs"
to it.
Before
{ // code omitted for brevity headerLinks: [ { doc: "your-entry-doc", label: "Docs", }, ];}
After
{ // code omitted for brevity headerLinks: [ { doc: "your-entry-doc", href: "/docs", label: "Docs", }, ];}
- Create a new file called
docs.js
under thewebsite\pages\en
path and insert the following code.
/** * Copyright (c) 2017-present, Facebook, Inc. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. */
const React = require("react");const Redirect = require("../../core/Redirect.js");
const siteConfig = require(process.cwd() + "/siteConfig.js");
function docUrl(doc, language) { return ( siteConfig.baseUrl + "docs/" + (language ? language + "/" : "") + doc + ".html" );}
class Docs extends React.Component { render() { return ( <Redirect redirect={docUrl("your-entry-doc", this.props.language)} config={siteConfig} /> ); }}
module.exports = Docs;
This code is just doing a redirect to /docs/your-entry-doc
. Don't forget to replace
your-entry-doc
with your own value.
Perfect! With this little change, our Docusaurus website is now able to handle requests to the
/docs
root path.
One little thing: I have tested it with Docusaurus version 1.5.1
. However, just try it!