Export `react-router` Redirect from shared component library
I did finally discover the issue which had little to do with react-router
and more with React
. I found that this error would only show in local development because the component-library
was linked via npm link
.
The resolution came from this answer: https://stackoverflow.com/a/38818358/715597
The solution in my case was to link React and React Router in the component library to the applications reference of React and React Router:
# link the component library
cd my-app
npm link ../component-library
# link its copy of React back to the app's React
cd ../component-library
npm link ../my-app/node_modules/react
npm link ../my-app/node_modules/react-router
You have to import router (assuming you're using V4) from react-router-dom, eg:
import { BrowserRouter as Router, Route, Link } from "react-router-dom";
In v4, react-router exports the core components and functions. react-router-dom exports DOM-aware components, like <Link> (which renders an <a>) and <BrowserRouter> (which interacts with the browser's window.history ).
react-router-dom re-exports all of react-router's exports, so you only need to import from react-router-dom in your project.
Ref: https://github.com/ReactTraining/react-router/issues/4648#issuecomment-284479720