How to get pre-rendered data in `routes` folder components

app.jsx

import { h, Component } from 'preact';
import { Router } from 'preact-router';
import { Provider } from '@preact/prerender-data-provider';
import Home from './routes/home';
import Route66 from './routes/route66';
import Custom from './routes/custom';
import './style.css';

 export default class App extends Component {
	handleRoute = e => {
		this.currentUrl = e.url;
	};

 	render(props) {
		return (
			<Provider value={props}>
				<div id="app">
					<Router url={props.url} onChange={this.handleRoute} {...props}>
						<Home path="/" />
						<Route66 path="/route66" />
						<Custom path="/custom" />
					</Router>
				</div>
			</Provider>
		);
	}
}

gistfile1.txt

import './custom.css';
import { withPrerenderData } from '@preact/prerender-data-provider';
const Custom = ({ CLI_PRERENDER_DATA: { myProp } }) => <div>{myProp}</div>;
export default withPrerenderData(Custom);