Skip to content

Commit

Permalink
feat: google fonts fetch
Browse files Browse the repository at this point in the history
  • Loading branch information
ErikPham committed Apr 1, 2024
0 parents commit 1be951c
Show file tree
Hide file tree
Showing 23 changed files with 6,532 additions and 0 deletions.
1 change: 1 addition & 0 deletions .github/FUNDING.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
github: [ErikPham]
87 changes: 87 additions & 0 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,87 @@
name: CI

on:
push:
branches:
- main

pull_request:
branches:
- main

jobs:
lint:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3

- name: Install pnpm
uses: pnpm/action-setup@v2

- name: Set node
uses: actions/setup-node@v3
with:
node-version: lts/*

- name: Setup
run: npm i -g @antfu/ni

- name: Install
run: nci

- name: Lint
run: nr lint

typecheck:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3

- name: Install pnpm
uses: pnpm/action-setup@v2

- name: Set node
uses: actions/setup-node@v3
with:
node-version: lts/*

- name: Setup
run: npm i -g @antfu/ni

- name: Install
run: nci

- name: Typecheck
run: nr typecheck

test:
runs-on: ${{ matrix.os }}

strategy:
matrix:
node: [lts/*]
os: [ubuntu-latest, windows-latest, macos-latest]
fail-fast: false

steps:
- uses: actions/checkout@v3

- name: Install pnpm
uses: pnpm/action-setup@v2

- name: Set node ${{ matrix.node }}
uses: actions/setup-node@v3
with:
node-version: ${{ matrix.node }}

- name: Setup
run: npm i -g @antfu/ni

- name: Install
run: nci

- name: Build
run: nr build

- name: Test
run: nr test
41 changes: 41 additions & 0 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
name: Publish Package

permissions:
id-token: write
contents: write

on:
push:
tags:
- v*

jobs:
release:
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v3
with:
fetch-depth: 0

- name: Install pnpm
uses: pnpm/action-setup@v2

- name: Use Node.js v18
uses: actions/setup-node@v3
with:
node-version: 18
registry-url: https://registry.npmjs.org/
cache: pnpm

- run: npx changelogithub
env:
GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}}

- run: pnpm install

- run: pnpm run ci:publish
env:
NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}}
NPM_CONFIG_PROVENANCE: true
NODE_OPTIONS: --max-old-space-size=6144
12 changes: 12 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
.cache
.DS_Store
.idea
*.log
*.tgz
coverage
dist
lib-cov
logs
node_modules
temp
.output
41 changes: 41 additions & 0 deletions .vscode/settings.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
{
// Enable the ESlint flat config support
"eslint.experimental.useFlatConfig": true,

// Disable the default formatter, use eslint instead
"prettier.enable": false,
"editor.formatOnSave": false,

// Auto fix
"editor.codeActionsOnSave": {
"source.fixAll": "explicit",
"source.organizeImports": "never"
},

// Silent the stylistic rules in you IDE, but still auto fix them
"eslint.rules.customizations": [
{ "rule": "style/*", "severity": "off" },
{ "rule": "*-indent", "severity": "off" },
{ "rule": "*-spacing", "severity": "off" },
{ "rule": "*-spaces", "severity": "off" },
{ "rule": "*-order", "severity": "off" },
{ "rule": "*-dangle", "severity": "off" },
{ "rule": "*-newline", "severity": "off" },
{ "rule": "*quotes", "severity": "off" },
{ "rule": "*semi", "severity": "off" }
],

// Enable eslint for all supported languages
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"vue",
"html",
"markdown",
"json",
"jsonc",
"yaml"
]
}
20 changes: 20 additions & 0 deletions LICENSE
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
Copyright (c) 2024 ErikPham

Permission is hereby granted, free of charge, to any person obtaining
a copy of this software and associated documentation files (the
"Software"), to deal in the Software without restriction, including
without limitation the rights to use, copy, modify, merge, publish,
distribute, sublicense, and/or sell copies of the Software, and to
permit persons to whom the Software is furnished to do so, subject to
the following conditions:

The above copyright notice and this permission notice shall be
included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
76 changes: 76 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,76 @@
## @frontlabs/google-fonts-fetch

### Description
`@frontlabs/google-fonts-fetch` is a lightweight and efficient package designed to simplify the process of self-host Google Fonts. By leveraging this package, developers can effortlessly download Google Fonts to their local environment, enabling seamless integration and improved website performance.

## Motivation
While working on improving PageSpeed, I discovered the significant enhancements brought by Google Fonts v2. Everything seemed to become smoother and lighter, from font sizes to the ability to reuse various font weights. Despite my efforts to find a suitable API or package for immediate use, I came up empty-handed.

For instance, take the font Roboto. The font sizes of version 1 compared to version 2 were ~130kb and ~11kb respectively. Different font weights could be utilized within a single file. The savings were substantial, sparking a strong inspiration within me to create this package. It's evident that this project has the potential to make a substantial impact on metrics such as FCP, LCP, and overall PageSpeed scores, significantly benefiting your website.

This project aims to harness the efficiencies of Google Fonts v2, offering a streamlined solution for integrating fonts into web projects. By optimizing font usage, we can enhance website performance and user experience, ultimately leading to improved rankings and user engagement.

### Features
- **Effortless Font Download**: Quickly fetch and download Google Fonts to your local project directory with minimal configuration.

- **Customizable Options**: Customize font selection, variants, and subsets to tailor the download to your specific project needs.

- **Optimized Performance**: Reduce page load times and enhance website performance by serving fonts directly from your server.

## Installation
```bash
npm install @frontlabs/google-fonts-fetch
```

## Usage
### Create Google Fonts Fetch
```js
import { createGoogleFontsFetch } from '@frontlabs/google-fonts-fetch'
const fetch = createGoogleFontsFetch({
base: 'https://test.com',
metadata: {
name: 'metadata.json',
override: false,
outputPath: path.resolve('.output/metadata'),
},
outputPath: path.resolve('.output'),
css: {
write: true,
combie: true,
},
font: {
outputPath: path.resolve('.output/fonts'),
},
})
```
### Download single font
```js
fetch.single('Roboto')
fetch.single('Roboto', { weight: [400] })
```

### Download multiple fonts
```js
fetch.multiple([
{ name: 'Roboto' },
{ name: 'Open Sans' },
])

fetch.multiple([
{ name: 'Roboto', weight: [400] },
{ name: 'Open Sans', weight: [400, 500] },
])
```

### Download all fonts
```js
helper.all()
```

## Contributing

Contributions are welcome! If you find any issues or have suggestions for improvements, please open an issue or submit a pull request.

## License

This project is licensed under the [MIT License](LICENSE).
12 changes: 12 additions & 0 deletions build.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { defineBuildConfig } from 'unbuild'

export default defineBuildConfig({
entries: [
'src/index',
],
declaration: true,
clean: true,
rollup: {
emitCJS: true,
},
})
15 changes: 15 additions & 0 deletions eslint.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
// @ts-check
import antfu from '@antfu/eslint-config'

export default antfu(
{
ignores: [
// eslint ignore globs here
],
},
{
rules: {
curly: 'off',
},
},
)
72 changes: 72 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,72 @@
{
"name": "@frontlabs/google-fonts-fetch",
"type": "module",
"version": "1.0.0",
"packageManager": "[email protected]",
"description": "A lightweight utility for seamlessly integrating Google Fonts into web projects, optimizing web performance, and enhancing user experience.",
"author": "ErikPham <[email protected]>",
"license": "MIT",
"repository": {
"type": "git",
"url": "git+https://github.com/FrontLabsOfficial/google-fonts-fetch.git"
},
"keywords": ["google", "google-fonts", "fonts", "webfont", "webfonts", "font", "fonts", "fontface", "font-face", "pagespeed"],
"sideEffects": false,
"exports": {
".": {
"types": "./dist/index.d.ts",
"import": "./dist/index.mjs",
"require": "./dist/index.cjs"
}
},
"main": "./dist/index.mjs",
"module": "./dist/index.mjs",
"types": "./dist/index.d.ts",
"typesVersions": {
"*": {
"*": [
"./dist/*",
"./dist/index.d.ts"
]
}
},
"files": [
"dist"
],
"scripts": {
"build": "unbuild",
"dev": "unbuild --stub",
"lint": "eslint .",
"prepublishOnly": "nr build",
"release": "bumpp",
"ci:publish": "npm publish --access public --no-git-check",
"test": "vitest",
"typecheck": "tsc --noEmit",
"prepare": "simple-git-hooks"
},
"dependencies": {
"consola": "^3.2.3",
"ofetch": "^1.3.4"
},
"devDependencies": {
"@antfu/eslint-config": "^2.6.4",
"@antfu/ni": "^0.21.12",
"@types/node": "^20.11.19",
"bumpp": "^9.3.0",
"eslint": "^8.56.0",
"esno": "^4.0.0",
"lint-staged": "^15.2.2",
"pnpm": "^8.15.3",
"simple-git-hooks": "^2.9.0",
"typescript": "^5.3.3",
"unbuild": "^2.0.0",
"vite": "^5.1.4",
"vitest": "^1.3.1"
},
"simple-git-hooks": {
"pre-commit": "pnpm lint-staged"
},
"lint-staged": {
"*": "eslint --fix"
}
}
Loading

0 comments on commit 1be951c

Please sign in to comment.