How to configure react app with a router and docusaurus app on the /docs path

Support
, ,
1

Hello,

I have two netlify apps building two different static apps,

One is a create-react-app that uses react-router and the other is a docusaurus static app.

So in a nutshell:

myapp.com/login # React App
myapp.com/profile # React App

myapp.com/docs # Redirect to docusaurus netlify app
myapp.com/docs/getting-started # docusaurus app with its own router

The react app netlify.toml is as follows

[[redirects]]
  from = "/docs"
  to = "https://docusaurus-website.netlify.com"
  status = 200

# Redirect to / so react-router works.
[[redirects]]
  from = "/*"
  to = "/"
  status = 200

I want to host my docusaurus site on mysite.com/docs however when i set the baseUrl to /docs my site is rendered but the assets do not load and the docusaurus router does not work.

Am I doing this the best way?

1 Like
2

Hey @karltaylor,
Yup, this looks like the right pattern :slight_smile: It’s similar to this one:

For the baseUrl for your docs site config, I would start with / as described in the Docusaurus docs.

As for your redirect rules, your first one will likely need a * and :splat:

  from = "/docs/*"
  to = "https://docusaurus-website.netlify.com/:splat"
  status = 200
  force = true

And the second one might need to be to = "/index.html".

Want to give this all a try and let us know if it works for you?

1 Like
3

I would like to redirect www.economize.cloud/docs to https://economize-docs.netlify.app. Both are hosted in seperate repositories and deployed through Netlify.

Below is the netlify.toml configuration of economize.cloud site.

[[redirects]]
  from = "/docs/*"
  to = "https://economize-docs.netlify.app/:splat"
  status = 200
  force = true

Below is the configuration of docusaurus:

module.exports = {
  title: "Economize Docs",
  tagline: "Your cloud infrastructure costs, demystified.",
  url: "https://economize-docs.netlify.app",
  baseUrl: "/docs/",
  onBrokenLinks: "throw",

While www.economize.cloud/docs redirects properly to Netlify, the https://economize-docs.netlify.app site still throws A very common reason is a wrong site baseUrl configuration.

I tried setting the baseUrl with / as you have mentioned, in that case, the netlify app works but economize.cloud/docs does not work. Please let us know what am I configuring wrong. Thanks in advance.

4

hey there, @Anirudh :wave:

Welcome to the Netlify Forums :netliconfetti: It looks like this thread has been a bit quiet since you reached out last week. Are you still encountering difficulties? If so, let us know what additional troubleshooting steps you have taken since you first posted. If you aren’t, please share your solution :slight_smile:

5

Hi Hilary, the error still persists. As mentioned, the redirect URL works without any error message, but the [site at Netlify](https://economize-docs.netlify.app/) still errors out. While this isn’t a blocker for us, would love to hear if you know any solution for this.

7

I would download your site and see if/where your index.html is — let’s focus on working out where and how we can get the economize-docs site working!