Cosa fa una “ `tilde in un CSS` url () `do?

Ad esempio @import url("~./foobar");

L’ho visto qui , non so se si tratta di una cosa specifica del pacchetto o se è la syntax CSS effettiva.

CSS @import è relativo alla directory di lavoro corrente.

Quindi, utilizzando il prefisso ~ all’inizio del percorso, il caricatore di Webpack è in grado di risolvere l’importazione “come un modulo”.

Ciò significa che se hai un modulo chiamato normalize disponibile e devi importare un file che gli appartiene normalize.css , puoi farlo con:

 @import "~normalize/normalize.css"; 

Nell’esempio collegato, all’interno di font-loader/example/test.js c’è un’importazione di un modulo chiamato font-boon .

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

All’interno di font-loader/example/test.css il modulo font-boon è @imported in modo che sia disponibile in text.css.

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