Skript herunterladen CSS -Datei mit Schriftarten und passen Sie sie an die Arbeit in geschlossener Umgebung/Offline an. Nützlich, beispielsweise wenn das Projekt im Netzwerk ohne Verbindung mit dem Internet oder wenn Sie anhand von Projekten wie Electron anwendet werden.
Das Skript kann manuell durch Klonen ./main.js -Datei" oder mit NPM "installiert" werden:
npm install get-google-fonts
Zum Beispiel CSS mit so verwendeten Schriftarten:
< link href =' https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic ' rel =' stylesheet ' >Kann ersetzt werden durch:
< link href =' fonts/fonts.css ' rel =' stylesheet ' > Wenn Sie in der Befehlszeile verwendet werden, ist dies möglich, wenn das Skript als global installiert wird oder Sie den vollständigen Pfad zur cli.js -Datei kennen. Standardmäßig wird NPM das Skript als global und danach bevorzugen, und danach werden die Datei in Bin-Verzeichnis mit dem Namen get-google-fonts geteilt. Dann können Sie diesen Befehl überall verwenden.
Usage:
get-google-fonts [OPTIONS] [ARGS]
Options:
-i, --input URL Input URL of CSS with fonts
-o, --output [STRING] Output directory (Default is ./fonts)
-p, --path [STRING] Path placed before every source of font in CSS (Default is ./)
-c, --css [STRING] Name of CSS file (Default is fonts.css)
-t, --template [STRING] Template of font filename (Default is {_family}-{weight}-{comment}{i}.{ext})
-u, --useragent STRING User-agent used at every connection
-q, --quiet Don't displays a lot of useful information
-b, --base64 Save fonts inside CSS file as base64 URIs
--non-strict-ssl Force to accepts only valid SSL certificates; in some
cases,such proxy or self-signed certificates
should be turned off
-w, --overwriting Allows overwrite existing files
--print-options Shows result options object without performing any
action
-s, --simulate Simulation; No file will be saved
-h, --help Display help and usage details
Um ein Ergebnis wie in Beispiel zu erhalten, geben Sie einfach den Befehl im Ordner mit der HTML -Datei ein:
get-google-fonts -i "https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic"
GET-Google-Fonts können als Modul erforderlich sein.
const GetGoogleFonts = require ( 'get-google-fonts' ) ; Um Ergebnis wie im Beispiel zu erhalten, erstellen Sie einfach Objekt und führen Sie download -Methode aus.
new GetGoogleFonts ( ) . download ( 'https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic' )
// => PromiseEs gibt drei nützliche Methoden im gesamten Modul.
Parameter:
config ermöglicht es Ihnen, alle von diesem Objekt durchgeführten Downloads vorkonfigurieren zu können. Weitere ... [optional]Beispiel:
let ggf_ttf = new GetGoogleFonts ( {
userAgent : 'Wget/1.18'
} )
let ggf_defaults = new GetGoogleFonts ( )Parameter:
url URL zu CSS als Schriftarten Objekt oder einfacher Zeichenfolge. Kann eine Reihe von Argumenten sein, die Hexen durch Getgooglefonts geleitet werden.config können Sie diesen einen Download konfigurieren. Weitere ... [optional]Beispiel:
ggf . download ( [
{
Roboto : [ 400 , 700 ]
} ,
[ 'cyrillic' ]
] ) . then ( ( ) => {
console . log ( 'Done!' )
} ) . catch ( ( ) => {
console . log ( 'Whoops!' )
} )
// or
ggf . download ( 'https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic' , {
userAgent : 'Wget/1.18'
} ) . then ( ( ) => {
console . log ( 'Done!' )
} ) . catch ( ( ) => {
console . log ( 'Whoops!' )
} )Generieren Sie URL von Google -Schriftarten mit den angegebenen Parametern.
Parameter:
families Objekt von Schriftarten Namen und Gewichtensubsets von TeilmengenBeispiel:
GetGoogleFonts . constructUrl (
{
Roboto : [ '400' , 700 ] ,
'Roboto' : [ 400 , '700i' ] ,
'Alegreya Sans SC' : [ 300 ]
} ,
[ 'cyrillic' ]
)
// => https://fonts.googleapis.com/css?family=Roboto:400,700,700i|Alegreya+Sans+SC:300&subset=cyrillic Objekte werden wie folgt betrachtet: Download config> getGoogleFonts Objektkonfiguration> Standardkonfiguration
// Default config object
{
// Output directory when where all files will be saved.
// According to this path, relative paths will be resolved.
outputDir : './fonts' ,
// Path placed before every source of font in CSS.
// It's also can be URL of your website.
path : './' ,
// Template of font filename.
template : '{_family}-{weight}-{comment}{i}.{ext}' ,
// Name of CSS file. Like other files
// will be placed relative to output directory
cssFile : 'fonts.css' ,
// User-agent used at every connection. Accordingly, Google Fonts will
// send the appropriate fonts. For example, providing a wget's
// user-agent will end with the download of .ttf fonts.
// Default user-agent downloads .woff2 fonts.
userAgent : 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 ' +
'(KHTML, like Gecko) Chrome/57.0.2987.133 Safari/537.36' ,
// Save fonts inside CSS file as base64 URIs
base64 : false ,
// Force to accepts only valid SSL certificates; in some cases,
// such proxy or self-signed certificates should be turned off
strictSSL : true ,
// Allows overwrite existing files.
overwriting : false ,
// Displays a lot of useful information.
verbose : false ,
// Simulation; No file will be saved.
simulate : false
} Folgende Variablen können in der Vorlage verwendet werden:
{comment} Text aus dem Kommentar vor @font-face. Google Ort dort Name der Teilmenge zB lateinisch{family} Schriftfamilie z.{_family} Schriftfamilie (Whitespace wird durch Unterstrich ersetzt) EG Source_Sans_Pro{weight} Schriftgewichts-Gewicht zB 400{filename} Name der Originaldatei EG ODELI1AHBYDBQGEIAH2ZLC2Q8SEG17BFDXYR_JUSRZG{ext} Originalerweiterung zB WOFF2{i} Eine Nummer, die jedes Mal nacheinander inkrementiert wird, wenn eine Schriftart hinzugefügt wird. Nützlich, um die Einzigartigkeit von Schriftstellennamen zu bewahren, falls Sie nicht sicher sind, ob die vorherigen Variablen ausreichen. Es beginnt von 1. Dieses Projekt ist unter der Lizenz apache -2.0 lizenziert - finden Sie in der lizenz.md -Datei für Details