block10.js

// App.js
import React, { lazy, Suspense } from 'react';
import { Router } from "@reach/router";

import Main from './Main';
// import SplitThis from './SplitThis';
import './App.css';

// lazy load the component
const SplitThis = lazy(() => import('./SplitThis'));

const App = () => (
  <div className="App">
    <Suspense fallback={ <h1>Loading route...</h1>}>
      <Router>
        <Main default path="/" />
        <SplitThis path="/split" />
      </Router>
    </Suspense>
  </div>
);

export default App;