Co robi `~` tylda w CSS ʻurl () `?

91

Na przykład @import url("~./foobar");

Widziałem to tutaj , nie jestem pewien, czy jest to coś specyficznego dla pakietu, czy też jest to rzeczywista składnia CSS.

ahstro
źródło
3
@JackMiller Nie, to nie jest operator wyboru, to część katalogu plików.
user4642212

Odpowiedzi:

132

CSS@import ścieżka <url>jest zazwyczaj w stosunku do bieżącego katalogu roboczego.

Zatem użycie prefiksu ~na początku ścieżki mówi programowi ładującemu Webpack, aby rozwiązał import „jak moduł” ze ścieżki modułu węzła.

Oznacza to, że jeśli masz normalizezainstalowany moduł węzła o nazwie i musisz zaimportować z niego plik o nazwie /normalize.css, możesz to zrobić za pomocą:

@import "~normalize/normalize.css";

W twoim połączonym przykładzie wewnątrz font-loader/example/test.jsznajduje się import modułu o nazwie font-boon.

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

Wewnątrz font-loader/example/test.cssmodułu font-boon jest @imported, aby był dostępny w text.css.

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

ksav
źródło
7
więc .. w zasadzie, czy ~zawiera node_moduleścieżkę?
adrianriyadi