get google fonts

احصل على خطوط Google

البرنامج النصي تنزيل ملف CSS مع الخطوط وتكييفه مع العمل في بيئة مغلقة/غير متصل. مفيد على سبيل المثال عندما يجب تشغيل المشروع في الشبكة دون اتصال مع الإنترنت أو عند تقديم التطبيق استنادًا إلى مشاريع مثل الإلكترون.

ابدء

يمكن "تثبيت" البرنامج النصي يدويًا عن طريق الاستنساخ ./main.js أو مع NPM:

 npm install get-google-fonts

مثال نتيجة

على سبيل المثال CSS مع الخطوط المستخدمة مثل هذا:

 < link href =' https://fonts.googleapis.com/css?family=Roboto:400,700&amp;subset=cyrillic ' rel =' stylesheet ' >

يمكن استبداله بـ:

 < link href =' fonts/fonts.css ' rel =' stylesheet ' > 

باستخدام سطر الأوامر

باستخدام سطر الأوامر ، يكون ذلك ممكنًا عند تثبيت البرنامج النصي على أنه global أو تعرف مسارًا كاملاً إلى ملف cli.js بشكل افتراضي ، تفضل NPM تثبيت البرنامج النصي على أنه Global وبعد تلك البرامج النصية ستشارك الملف في دليل BIN المسمى get-google-fonts . ثم يمكنك فقط استخدام هذا الأمر في أي مكان.

 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

للحصول على نتيجة مثل على سبيل المثال ، ما عليك سوى إدخال الأمر في المجلد مع ملف HTML:

 get-google-fonts -i "https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic"

باستخدام الكود

يمكن أن تكون هناك حاجة إلى مقاطع get-google كوحدة نمطية.

 const GetGoogleFonts = require ( 'get-google-fonts' ) ;

للحصول على النتيجة كما في المثال ، فقط إنشاء كائن وتشغيل طريقة download .

 new GetGoogleFonts ( ) . download ( 'https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic' )
// => Promise

هناك ثلاث طرق مفيدة في جميع الوحدات النمطية.

مُنشئ

حدود:

• يتيح لك config التكوين المسبق لجميع التنزيلات التي قام بها هذا الكائن. شاهد المزيد ... [اختياري]

مثال:

 let ggf_ttf = new GetGoogleFonts ( {
	userAgent : 'Wget/1.18'
} )
let ggf_defaults = new GetGoogleFonts ( )

تحميل

حدود:

• url url إلى css ككائن خطوط أو سلسلة عادي. يمكن أن تكون مجموعة من الحجج التي سيتم تمرير الساحرة من خلال getGooglefonts.Constructurl ().
• يتيح لك config تكوين هذا التنزيلات. شاهد المزيد ... [اختياري]

مثال:

 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!' )
} )

البناء

إنشاء عنوان URL لخطوط Google باستخدام معلمات معينة.

حدود:

• يعرض families من الأسماء والأوزان الخطوط
• مجموعة subsets من المجموعات الفرعية

مثال:

 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 

كائن التكوين

سيتم النظر في الكائنات على النحو التالي: تنزيل config> getGooglefonts كائن تكوين> تكوين افتراضي

 // 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
} 

نموذج

يمكن استخدام المتغيرات التالية في القالب:

• {comment} نص من التعليق الموضوعة قبل @font-face. google مكان هناك اسم مجموعة فرعية مثل اللاتينية
• {family} font-family eg source sans pro
• {_family} font-family (سيتم استبدال مساحة البيضاء بـ Soundscore) eg source_sans_pro
• {weight} Font-Weight eg 400
• {filename} اسم الملف الأصلي eg odeli1ahbydbqgeiah2zlc2q8seg17bfdxyr_jusrzg
• {ext} الامتداد الأصلي على سبيل المثال woff2
• {i} رقم يتم زيادة واحدة تلو الأخرى في كل مرة يتم فيها إضافة ملف خط. من المفيد الحفاظ على تفرد أسماء الخطوط في حال لم تكن متأكدًا مما إذا كانت المتغيرات السابقة كافية. يبدأ من 1.

رخصة

تم ترخيص هذا المشروع بموجب ترخيص Apache -2.0 - راجع ملف الترخيص.