React Router with React 16.6 Suspense "Invalid prop `component` of type `object` supplied to `Route`, expected `function`." : <p>I'm using the latest version (16.6) of React with <code>react-router</code> (4.3.1) and trying to use code splitting using <code>React.Suspense</code>.</p>

<p>Although my routing is working and the code did split into several bundles loaded dynamically, I'm getting a warning about not returning a function, but an object to <code>Route</code>. My code:</p>

<pre><code>import React, { lazy, Suspense } from 'react';
import { Switch, Route, withRouter } from 'react-router-dom';

import Loading from 'common/Loading';

const Prime = lazy(() =&gt; import('modules/Prime'));
const Demo = lazy(() =&gt; import('modules/Demo'));

const App = () =&gt; (
  &lt;Suspense fallback={&lt;Loading&gt;Loading...&lt;/Loading&gt;}&gt;
    &lt;Switch&gt;
      &lt;Route path="/" component={Prime} exact /&gt;
      &lt;Route path="/demo" component={Demo} /&gt;
    &lt;/Switch&gt;
  &lt;/Suspense&gt;
);

export default withRouter(App);
</code></pre>

<p>The console warning is as follows:
<code>Warning: Failed prop type: Invalid prop `component` of type `object` supplied to `Route`, expected `function`.</code></p>

<p>A normal import would return a function, but the dynamic import with <code>lazy()</code> is returning an object. </p>

<p>Any fixes for this?</p>
