Registry / web-framework / react-router-guards

react-router-guards

JSON →
library1.0.2jsnpmunverified

Provides a middleware API for React Router (v5), allowing developers to run guard functions between navigation and route rendering. Currently at version 1.0.2, it is stable but not actively maintained (last update 2019). Key features include GuardProvider and GuardedRoute components, support for meta data on routes, loading/error components, and TypeScript types. Unlike simple auth wrappers, it offers a full lifecycle with next() callbacks for redirects, async guards, and error handling.

npm install react-router-guards
INSTALL
IMPORT
SIG · REACT-ROUTER-GUARD
R
react-router-guards
web-frameworkjavascriptv1.0.2
Install
Import
Disk
Pass rate
0/ 6
Env Coverage0 / 6
glibc
1822
musl
1822
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18226 runs
build_error
glibc
node 18226 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

GuardProvider
import { GuardProvider } from 'react-router-guards'
const GuardProvider = require('react-router-guards').GuardProvider
Default export is not available; use named imports only.
GuardedRoute
import { GuardedRoute } from 'react-router-guards'
import GuardedRoute from 'react-router-guards'
Named export, not default.
next function
const requireLogin = (to, from, next) => { next(); }
const requireLogin = (to, from, callback) => { callback(); }
The third parameter must be named 'next' for the guard API to function; renaming breaks middleware.

Sets up guard middleware with a loading component, an auth guard that redirects unauthenticated users, and meta data on routes.

import React from 'react'; import { BrowserRouter, Switch } from 'react-router-dom'; import { GuardProvider, GuardedRoute } from 'react-router-guards'; const Home = () => <div>Home</div>; const Login = () => <div>Login</div>; const Loading = () => <div>Loading...</div>; const Error = () => <div>Error</div>; const requireAuth = (to, from, next) => { const isLoggedIn = localStorage.getItem('token'); if (to.meta.auth && !isLoggedIn) { next.redirect('/login'); } else { next(); } }; function App() { return ( <BrowserRouter> <GuardProvider guards={[requireAuth]} loading={Loading} error={Error}> <Switch> <GuardedRoute exact path="/login" component={Login} /> <GuardedRoute exact path="/" component={Home} meta={{ auth: true }} /> </Switch> </GuardProvider> </BrowserRouter> ); } export default App;
Debug
Known issues
deprecatedPackage last updated in 2019; compatible only with React Router v5, not v6.
fix
Use react-router-dom v5 or consider migrating to React Router v6 with alternative guard solutions.
affects: >=1.0.0
gotchaGuard functions must call next() exactly once; otherwise route may hang or render incorrectly.
fix
Ensure every guard calls next() or next.redirect() in all code paths.
affects: >=1.0.0
gotchaThe 'loading' prop on GuardProvider should be a React component, not null or undefined when async guards are used.
fix
Provide a loading component to avoid blank screen during async guard resolution.
affects: >=1.0.0
Errors
Common errors & fixes
TypeError: Cannot read property 'redirect' of undefined
The 'next' parameter in guard function is undefined due to incorrect signature (using wrong parameter count or names).
fix
Define guard as (to, from, next) => ... and ensure exactly three parameters.
Warning: React version mismatch. Expected >=16.8.0.
Installed package with React version older than 16.8.0 (hooks not supported).
fix
Update React to >=16.8.0 using 'npm install react@latest'.
Module not found: Can't resolve 'react-router-dom'
Missing peer dependency react-router-dom.
fix
Install react-router-dom v5: 'npm install react-router-dom@5.0.0'.
Upgrade
Version history
1.0.2latest on npm
Audit
Dependencies
reactrequiredPeer dependency - uses hooks (>=16.8.0)
react-router-domrequiredPeer dependency - designed to work with React Router v5
Agent activity
4 hits · last 30 days
node
4
Resources
react-router-guards — npm install react-router-guards · libregistry