글꼴이있는 CSS 파일을 다운로드하고 폐쇄 된 환경/오프라인에서 작업에 적응합니다. 예를 들어, 프로젝트가 인터넷과 연결되지 않고 또는 전자와 같은 프로젝트를 기반으로 응용 프로그램을 작성할 때 프로젝트가 네트워크에서 실행되어야하는 경우에 유용합니다.
스크립트는 ./main.js 파일 또는 NPM으로 클로닝하여 수동으로 "설치"할 수 있습니다.
npm install get-google-fonts
예를 들어 다음과 같이 사용되는 글꼴이있는 CSS :
< link href =' https://fonts.googleapis.com/css?family=Roboto:400,700&subset=cyrillic ' rel =' stylesheet ' >다음과 같이 대체 할 수 있습니다.
< link href =' fonts/fonts.css ' rel =' stylesheet ' > 명령 줄을 사용하여 스크립트가 global 로 설치되거나 cli.js 파일에 대한 전체 경로를 알고있을 때 가능합니다. 기본적으로 NPM은 스크립트를 글로벌로 설치하는 것을 선호하며 그 후 스크립트는 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-Fonts는 모듈로 필요할 수 있습니다.
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. 인수가 될 수 있습니다.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!' )
} )주어진 매개 변수를 사용하여 Google 글꼴의 URL을 생성하십시오.
매개 변수 :
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 객체는 다음과 같이 고려됩니다 : 다운로드 구성> 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} 텍스트. Google은 Subset의 이름으로 표시됩니다{family} Font-Family Eg Source Sans Pro{_family} font-family (whitespace가 밑줄로 대체 될 것입니다){weight} 글꼴 중량 예를 들어 400{filename} 원본 파일의 이름, 즉 odeli1ahbydbqgeiah2zlc2q8seg17bfdxyr_jusrzg{ext} 원래 확장자 예를 들어 Woff2{i} 글꼴 파일이 추가 될 때마다 하나씩 증가하는 숫자. 이전 변수가 충분한 지 확실하지 않은 경우 글꼴 이름의 고유성을 보존하는 데 유용합니다. 1부터 시작합니다. 이 프로젝트는 Apache -2.0 라이센스에 따라 라이센스가 부여됩니다 - 자세한 내용은 License.md 파일을 참조하십시오.