WebpackでのCSSスタイルのインポート

Webpackでは、CSSスタイルをJavaScriptファイルに直接インポートすることができます。以下のように記述します:

src/index.jsimport './styles.css';

インポートされたスタイルは、JavaScriptのバンドルファイルに直接挿入されます。 その後、バンドルをHTMLファイルに接続すると、スクリプト自身がこれらのスタイルをstyleタグ内に挿入します。

ただし、Webpackはこれほど単純にはスタイルをインポートできません。 このためにはいくつかの設定を行う必要があります。 それらについては次のレッスンで取り組みます。