L'application Next.js intégrée disparaît soudainement après un certain temps de chargement, mais fonctionne correctement dans l'environnement de développement
P粉668113768
2023-08-15 15:51:16
<p>Mon projet next.js utilisant TypeScript fonctionne correctement dans l'environnement de développement, mais lors de la construction de <code>npm, exécutez build</code> Je pense que cela a quelque chose à voir avec la mise en page de la page, mais je n'en suis pas sûr. J'ai obtenu les informations suivantes dans la console. </p>
<p> Erreur non détectée : erreur React minifiée #418 ; visitez https://reactjs.org/docs/error-decoder.html?invariant=418 pour le message complet, ou pour l'erreur complète et d'autres avertissements utiles utilisés dans un environnement de développement non minifié.
Erreur non détectée : erreur React minifiée n° 423 ; visitez https://reactjs.org/docs/error-decoder.html?invariant=423 pour le message complet, ou pour un développement non minifié, l'erreur complète et d'autres environnements d'avertissement utiles.
DOMException : l'exécution de 'appendChild' sur 'Node' a échoué : un seul élément est autorisé sur le document.
DOMException : 'removeChild' sur 'Node' a échoué : 'Le nœud à supprimer n'est pas un enfant de ce nœud.'</p>
<p><strong>layout.tsx</strong></p>
<pre class="brush:php;toolbar:false;">importer './globals.css'
type d'importation { Métadonnées } depuis 'suivant'
// importer {Inter} depuis 'next/font/google'
importer la barre de navigation depuis '../components/Navbar'
importer l'image depuis 'suivant/image'
// const inter = Inter({ sous-ensembles : ['latin'] })
exporter les métadonnées const : Métadonnées = {
titre : « expurgé »,
description : 'Site personnel',
}
exporter la fonction par défaut RootLayout({
enfants,
} : {
enfants : React.ReactNode
}) {
retour (
<div className="relative">
<div className="-z-1 bg-night absolu encart-0">
<div className="fixe w-screen h-screen pointer-events-none bg-scroll">
<Image src="/bg-circle.png" alt={''} layout="fill" objectFit="couverture" />
</div>
</div>
<div className='flex justification-center'>
<div className="fixé z-10 w-2/5">
<Barre de navigation />
</div>
</div>
<div className="relative z-0">{enfants}</div>
</div>
)
}</pré>
<p>J'ai essayé de modifier le composant {children} mais rien ne semble fonctionner. </p>
Avez-vous essayé d'utiliser le type
React.ReactNode[]
pour les enfants ?