react-dynamic-sitemap v1.2.1

React Dynamic Sitemap

Never have to worry about updating your sitemap again!

This component will scan through your React Router and dynamically generate your sitemap

Note: This has only been used with React Router v4, earlier versions might not work

Setup

npm i react-dynamic-sitemap

Usage

You should already have a router that looks somthing like this:

<Switch>
    <Route path="/" component={Home}/>
    <Route path="/login" component={Login}/>
    <Route path="/profile" component={Profile}/>
</Switch>

Note: If this is not already in its own dedicated component, you will need to extract it into its own one

As this component needs access to the Router, you will need a new component to call this, so create a component that looks like this:

import React from "react";
// The import below should be updated to match your Router component
import Routes from "../Routes";
import DynamicSitemap from "react-dynamic-sitemap";

export default function Sitemap(props) {
	return (
		<DynamicSitemap routes={Routes} prettify={true} {...props}/>
	);
}

Then add a new Route to your Router to serve your sitemap:

<Route path="/sitemap" component={Sitemap}/>

Finally add the following to all of your routes: