Testen des CSS-Bundle-Builds in Webpack

Lassen Sie uns das Bündeln von CSS in ein separates Bundle testen. Nehmen wir an, wir haben zwei CSS-Dateien.

Die erste:

src/styles1.cssbody {
  background: red;
}

Die zweite:

src/styles2.cssp {
  color: green;
}

Importieren wir sie zum Einstiegspunkt:

src/index.jsimport './styles1.css';
import './styles2.css';

Der Build-Befehl für das Projekt fasst alles in einer separaten Datei mit dem Namen main.css zusammen:

dist/main.cssbody {
  background: red;
}
p {
  color: green;
}
Задание 1

Importieren Sie drei CSS-Dateien zu Ihrem Einstiegspunkt.

Задание 2

Führen Sie den Build im Entwicklungsmodus aus. Untersuchen Sie die CSS-Bundle-Datei.

Задание 3

Führen Sie den Build im Produktionsmodus aus. Untersuchen Sie die CSS-Bundle-Datei.