Que dois-je faire si React ne peut pas analyser les CSS ?

React ne peut pas analyser le CSS car lorsque webpack configure le chargeur du fichier "css/less", la modularisation n'est pas activée par défaut ou est due à une mauvaise méthode d'introduction. La solution : 1. Changez la configuration du chargeur de webpack 2 ; . Importez-le simplement dans le fichier "index.css" via "@import '~antd/dist/antd.css';".

L'environnement d'exploitation de ce tutoriel : système Windows 10, React version 18.0.0, ordinateur Dell G3.

Que dois-je faire si React ne peut pas analyser les CSS ?

• react L'introduction modulaire de fichiers CSS externes ne prend pas effet Lors de l'introduction de fichiers CSS/less externes dans React, si vous les importez directement => importer "./search.less" ;

Directement lors de l'utilisation. className, comme indiqué ci-dessous :

Mais si vous utilisez cette méthode pour introduire =》importer des styles depuis « ./search.less » ;

, vous constaterez que le style ne prend pas effet, comme indiqué ci-dessous :

La raison est que lorsque webpack configure le chargeur de fichiers css/less, la modularisation n'est pas activée par défaut. L'introduction de cette approche modulaire nécessite de modifier la configuration du chargeur de webpack, comme indiqué ci-dessous :

.

Présentation du style antd dans React Pas efficace ?

• Je pense qu'il est plus pratique d'utiliser des composants antd lors de l'écriture de code (bien que antd soit également très étanche)

Cela est également arrivé auparavant, en raison de problèmes de téléchargement d'antd, la source utilisant npm ne peut pas être utilisée en Chine. Vous pouvez utiliser la source miroir de Taobao. Si cela ne fonctionne toujours pas, utilisez le hotspot de votre téléphone portable pour le télécharger

Mais cette fois, il y a eu un problème car le style antd n'a pas pris effet, j'ai donc installé antd plusieurs fois. J'ai essayé npm, cnpm et fil, mais cela n'a toujours pas fonctionné

J'ai donc cherché en ligne, mais aucune des solutions ne semblait être la bonne. Ensuite, je suis allé sur le site officiel pour regarder la méthode d'introduction

, qui. a l'expression suivante :

Mon code est écrit dans d'autres dossiers sous scr , et le fichier js ne crée pas de fichier css correspondant, il ne devrait pas être nécessaire d'introduire antd/dist/antd.css

J'ai donc pensé qu'il devrait être introduit dans le CSS du fichier d'index du fichier d'entrée, et c'est devenu

Solution :

1 Vérifiez si antd est introduit avec succèsEssayez encore quelques fois s'il y en a aussi. de nombreux avertissements, l'explication traîne

npm i antd
cnpm i antd
yarn add antd

2 Introduire dans le fichier index.css :

@import '~antd/dist/antd.css';

Apprentissage recommandé : "

Tutoriel vidéo React

》

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!