Was macht eine `~` Tilde in einer CSS `url ()`?

Z.B @import url("~./foobar");

Ich habe es hier gesehen und bin mir nicht sicher, ob es sich um eine paketspezifische Sache handelt oder ob es sich um eine tatsächliche CSS-Syntax handelt.

Der CSS-@import Pfad <url>ist normalerweise relativ zum aktuellen Arbeitsverzeichnis.

~Wenn Sie also das Präfix am Anfang des Pfads verwenden, wird der Webpack-Loader angewiesen, den Import "wie ein Modul" von einem Knotenmodulpfad aufzulösen.

Dies bedeutet, dass Sie Folgendes tun können , wenn Sie ein Knotenmodul mit dem Namen normalizeinstalliert haben und eine Datei mit dem Namen importieren /normalize.cssmüssen:

@import "~normalize/normalize.css";

In Ihrem verknüpften Beispiel wird font-loader/example/test.jsein Modul namens importiert font-boon.

var boon = require('./font-boon');

Innerhalb des font-loader/example/test.cssFont-Boon-Moduls befindet sich @imported, damit es in verfügbar ist text.css.

@import url("~./font-boon");