Maison >interface Web >tutoriel CSS >Pourquoi ne puis-je pas importer du CSS global à partir de fichiers autres que « pages/_app.js » dans Next.js 9.2 ?

Pourquoi ne puis-je pas importer du CSS global à partir de fichiers autres que « pages/_app.js » dans Next.js 9.2 ?

Barbara Streisand
Barbara Streisandoriginal
2024-11-29 15:35:10204parcourir

Why Can't I Import Global CSS from Files Other Than `pages/_app.js` in Next.js 9.2 ?

Pourquoi « Le CSS global ne peut pas être importé à partir de fichiers autres que votre personnalisée » ?

La version 9.2 de Next.js introduit un réorganiser la façon dont le CSS global est géré. Avant cette version, le CSS global pouvait être importé depuis n'importe quel module. Cependant, cette pratique a entraîné des difficultés dans la personnalisation des thèmes et la gestion des styles.

Solution :

Pour résoudre ce problème, Next.js exige désormais que toutes les importations CSS globales soient déplacé vers le fichier pages/_app.js. Cela permet aux développeurs de centraliser et de contrôler les styles globaux sans les disperser sur plusieurs fichiers.

Étapes pour résoudre l'erreur :

  1. Supprimer Legacy Sass Loader : Remplacez le package @zeit/next-sass par sass.
  2. Supprimer la configuration next.config.js : Supprimez la configuration CSS de next.config.js pour vous appuyer sur le chargeur CSS intégré.
  3. Déplacez le CSS global vers pages/_app.js : Importez le CSS global dans le fichier pages/_app.js, comme indiqué dans la réponse exemple.

Remarque : Si vous devez ajouter des styles à des composants ou des pages spécifiques, vous pouvez utiliser la fonctionnalité de modules CSS intégrés. Cela vous permet de créer des styles étendus qui ne sont appliqués qu'aux composants ou aux pages spécifiques où ils sont importés.

Informations supplémentaires :

  • [Next.js CSS Chargeur](https://nextjs.org/docs/advanced-features/customizing-css)
  • [Modules CSS dans Next.js](https://nextjs.org/learn/basics/css/ modules)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn