1. ホーム
  2. javascript

[解決済み] React ComponentでCSSファイルをインポートする方法

2022-03-07 07:19:59

質問

リアクトコンポーネントにCSSファイルを取り込みたいのですが、どうすればいいですか?

試しに import disabledLink from "../../../public/styles/disabledLink"; が、以下のようなエラーが発生します。

モジュールが見つかりませんでした。Error: Cannot resolve 'file' or 'directory' ../../../public/styles/disabledLink in c:\UsersUserDocumentspizza-appclientsrccomponents @ ./client/src/components/ShoppingCartLink.js 19:20-66 Hash: 2d281bb98fe0a961f7c4 Version: webpack 1.13.2

C:\Users\User\Documents\pizza-app\client\public\styles\disabledLink.css は、読み込もうとしているCSSファイルの場所です。

私には、import が正しいパスを検索していないように思えます。

と思ったのですが ../../../ を実行すると、3つ上のフォルダの階層にあるパスを検索し始めるでしょう。

C:\Users\User\Documents\pizza-app\client\src\components\ShoppingCartLink.js は、CSSファイルをインポートするファイルの場所です。

何が間違っているのか、どうすれば直るのか?

解決方法は?

必要なければ名前もつけなくていいんです。

import React from 'react';
import './App.css';

完全な例はこちらをご覧ください ( ReactコンポーネントとしてJSX Liveコンパイラを構築する ).