Webpack が「css/less」ファイルのローダーを構成するときに、モジュール化がデフォルトで有効になっていない、または導入方法が間違っているため、React は CSS を解析できません。解決策: 1. Webpack のローダー構成を変更します。 ; 2.「index.css」ファイルの「@import '~antd/dist/antd.css';」で導入します。
このチュートリアルの動作環境: Windows 10 システム、react18.0.0 バージョン、Dell G3 コンピューター。
react が CSS を解析できない場合はどうすればよいですか?
#react 外部 css ファイルのモジュラー導入が有効にならない問題の処理
react に外部 css/less ファイルを導入する場合、直接 Import=》import “./search.less” とする場合;
以下に示すように、使用するときは className を直接使用してください:
ただし、これを使用すると、スタイルのインポート =》「./search.less」からスタイルをインポートします;
以下に示すように、スタイルが有効にならないことがわかります:
#その理由は、webpack が css/less ファイルのローダーを構成する場合、デフォルトではモジュール化が有効になっていないためです。このモジュール化アプローチを導入するには、以下に示すように webpack のローダー構成を変更する必要があります:1. antd が正常に導入されたかどうかを確認します
警告が多すぎる場合は、さらに数回試してください。 、停止中であることを意味します
npm i antd cnpm i antd yarn add antd
2。index.css ファイルに導入します:
@import '~antd/dist/antd.css';
推奨される学習: "
react ビデオ チュートリアル以上がReact が CSS を解析できない場合はどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。