Nextjs : le chargement ou le repli en suspens n'apparaît pas en production

Question

J'ai migré mes pages personnelles vers le répertoire de l'application en utilisant nextjs v13.

J'ai d'abord essayé dans le composant Suspense 组件的 fallback 属性中添加 RSC 加载程序，并添加位于 app 目录中每个路由的路径中的 loading.

// src/app/posts/loading.tsx
import { Container } from '~/components/organisms/container';

export default function Loading() {
  return (
    <Container>
      {/* Add a big loading string with tailind */}
      <span className="text-6xl font-bold text-center text-red-500">Loading...</span>
    </Container>
  );
}

Il y a aussi ça

// src/app/posts/page.tsx
export default async function PostsPage() {
  return (
    <Container>
      <PageHeader
        title='Posts'
        description="I love to write about things I'm learning. 
            Blogging is a great way to improve and share knowledge.
            And who knows, maybe one day it might help me to write a book!"
      />
      <Suspense
        fallback={
          <Container>
            {/* Add a big loading string with tailind */}
            <span className='text-6xl font-bold text-center text-red-500'>
              Loading...
            </span>
          </Container>
        }
      >
        {/* @ts-expect-error Server Component */}
        <Posts />
      </Suspense>
    </Container>
  );
}

Tous deux engagés dans le développement local

Mais ils n'apparaissent pas dans mon déploiement Vercel

• Enveloppez RSC avec Suspense : cette URL
• Utiliser loading.tsx fichier : cette URL

J'utilise node localement 18.16，在我的 vercel 部署中使用节点 18.x. J'ai également déployé le projet nextjs dans Vercel en utilisant la configuration par défaut.

Si quelqu'un a besoin de plus de détails, le code de l'agence peut être trouvé ici

Answer 1

Vous n'avez pas indiqué comment charger les données, mais si vous utilisez le nouveau fetch, cela peut être lié à la mise en cache intégrée que nextjs effectue -- elle mettra en cache les données indéfiniment par défaut. En production, votre message aura l'air chargé instantanément