#reactjs #next.js
Вопрос:
Я реализовал загрузочный экран на своем Next.js веб — сайт, который хорошо работает локально во время разработки, но совсем не в производстве-предположительно, это связано с тем, что я использую getStaticProps, который предварительно загружается в производство, но все еще загружается по требованию в процессе разработки.
Мне интересно, возможно ли вообще заставить этот загрузочный экран работать в рабочем режиме на статическом сайте?
Вот код, который у меня есть до сих пор в моем файле _app.tsx:
function MyApp({ Component, pageProps }: AppProps) { const router = useRouter(); const [pageLoading, setPageLoading] = React.useStatelt;booleangt;(false); useEffect(() =gt; { const handleStart = () =gt; { setPageLoading(true); }; const handleComplete = () =gt; { setPageLoading(false); }; router.events.on('routeChangeStart', handleStart); router.events.on('routeChangeComplete', handleComplete); router.events.on('routeChangeError', handleComplete); }, [router]); return pageLoading ? lt;Loading /gt; : lt;Component {...pageProps} /gt; } lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"gt;lt;/scriptgt; lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"gt;lt;/scriptgt; Комментарии:
1. «хорошо работает локально во время разработки, но совсем не в производстве» — Можете ли вы быть более конкретным? Не отображается ли загрузка? Вы получаете сообщение об ошибке?