Registry / devops / google-fonts-webpack-plugin

google-fonts-webpack-plugin

library0.4.4jsnpmunverified

A webpack plugin that downloads Google Fonts to your build folder using google-webfonts-helper or links to the Google Fonts CDN. Version 0.4.4 is the latest stable release; activity is sporadic with no recent updates. Key differentiators: seamless integration with webpack and html-webpack-plugin, support for multiple font formats (eot, woff, woff2, ttf, svg), and optional local hosting versus CDN linking.

devops

npm install google-fonts-webpack-plugin

github ↗package ↗

INSTALL

IMPORT

SIG · GOOGLE-FONTS-WEBPA

google-fonts-webpack-plugin

devopsjavascriptv0.4.4

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

GoogleFontsPlugin

✓ const GoogleFontsPlugin = require('google-fonts-webpack-plugin')

✗ import GoogleFontsPlugin from 'google-fonts-webpack-plugin'

This package does not ship ESM; use CommonJS require(). ECMAScript modules are not supported.

GoogleFontsPlugin

✓ import GoogleFontsPlugin = require('google-fonts-webpack-plugin')

For TypeScript with esModuleInterop, use import = require() syntax.

options

✓ new GoogleFontsPlugin({ fonts: [] })

✗ new GoogleFontsPlugin([{ family: "Roboto" }])

The constructor expects an options object, not an array. Pass fonts as an array inside the options object.

Demonstrates basic configuration: specifying font families with variants, setting local download with woff2/woff formats, and custom output path and CSS filename.

// webpack.config.js const GoogleFontsPlugin = require('google-fonts-webpack-plugin'); const path = require('path'); module.exports = { entry: './src/index.js', output: { path: path.resolve(__dirname, 'dist'), filename: 'bundle.js' }, plugins: [ new GoogleFontsPlugin({ fonts: [ { family: 'Roboto', variants: ['400', '700'] }, { family: 'Open Sans', variants: ['300', '600italic'] } ], path: 'font/', // relative to output path filename: 'fonts.css', formats: ['woff2', 'woff'], local: true // download fonts locally }) ] };

Debug

Known issues

deprecatedThis package is no longer actively maintained; consider using @next/font or a more modern solution.

fix

Migrate to a maintained alternative like @next/font (Next.js) or fontsource packages.

affects: >=0.0.0

gotchaThe 'local' option must be set to true for fonts to be downloaded; otherwise, only a CSS link is generated.

fix

Set local: true in the options object if you want fonts bundled locally.

affects: >=0.4.0

gotchaIf html-webpack-plugin is not installed, setting local to false will throw an error because it tries to inject a link into the HTML template.

fix

Install html-webpack-plugin or set local: true to avoid dependency on it.

affects: >=0.0.0

gotchaThe google-webfonts-helper API (default apiUrl) may be unreliable or slow; it's a Heroku app that can be down.

fix

If the API is down, consider using a self-hosted instance or switch to local: false and use CDN.

affects: >=0.0.0

gotchaFont variants must match the exact format returned by google-webfonts-helper (e.g., '400', '700italic'); invalid variants cause silent failures.

fix

Verify variant strings against the Google Fonts API or google-webfonts-helper.

affects: >=0.0.0

Errors

Common errors & fixes

Error: Cannot find module 'google-webfonts-helper'

The package does not automatically install peer dependencies; missing google-webfonts-helper.

fix

Run 'npm install google-webfonts-helper' as a dependency.

TypeError: GoogleFontsPlugin is not a constructor

CommonJS require() was used incorrectly or the import was attempted as default import in ESM.

fix

Use 'const GoogleFontsPlugin = require('google-fonts-webpack-plugin');'

ERROR in Plugin could not be instantiated

The options object is empty or malformed (e.g., missing fonts array).

fix

Ensure the plugin is instantiated with an options object containing a 'fonts' array.

HTML Webpack Plugin Error: No template provided

local is false but html-webpack-plugin is not properly configured.

fix

Either set local: true or install and configure html-webpack-plugin.

Upgrade

Version history

0.4.4latest on npm

Audit

Dependencies

webpackrequiredPeer dependency; plugin requires webpack >=2.2.0 to function.

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/gabiseabra/google-fonts-webpack-plugin ↗

packagehttps://www.npmjs.com/package/google-fonts-webpack-plugin ↗