Que fait un tilde `~` dans une CSS ʻurl () `?

Par exemple @import url("~./foobar");

Je l' ai vu ici , je ne sais pas s'il s'agit d'un élément spécifique au package ou s'il s'agit d'une syntaxe CSS réelle.

Le chemin CSS@import<url> est généralement relatif au répertoire de travail actuel.

Ainsi, l'utilisation du préfixe ~au début du chemin indique au chargeur Webpack de résoudre l'importation "comme un module" à partir d'un chemin de module de nœud.

Cela signifie que si vous avez un module de nœud appelé normalizeinstallé et que vous devez importer un fichier à partir de celui-ci nommé /normalize.css, vous pouvez le faire avec:

@import "~normalize/normalize.css";

Dans votre exemple lié, à l'intérieur, font-loader/example/test.jsil y a une importation d'un module appelé font-boon.

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

À l'intérieur du font-loader/example/test.cssmodule font-boon se trouve @imported afin qu'il soit disponible dans text.css.

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