Update google-fonts-plugin

.gitignore

@@ -35,3 +35,6 @@ coverage
 # Temporary
 temp
 temp-*
+
+# Jetbrains products
+.idea

.npmignore

@@ -39,3 +39,6 @@ plugins/dist
 # Temporary
 temp
 temp-*
+
+# Jetbrains products
+.idea

package.json

@@ -82,7 +82,7 @@
     "fs-extra": "^7.0.0",
     "get-urls": "^8.0.0",
     "globby": "^8.0.1",
-    "google-fonts-plugin": "2.0.2",
+    "google-fonts-plugin": "^5.0.2",
     "object-hash": "^1.3.0"
   },
   "main": "gatsby-ssr.js",

plugins/export/download-css.js

@@ -1,23 +1,23 @@
-const GoogleFontsWebpackPlugin = require(`google-fonts-plugin`)
+const GoogleFontsPluginOptions = require(`google-fonts-plugin/dist/Options/Options`).default
+const GoogleFontsPluginFonts = require(`google-fonts-plugin/dist/Fonts/Fonts`).default
+const fs = require(`fs`)
 const path = require(`path`)
 
-module.exports = async ({
-	fonts,
-	formats = [
-		//`eot`,
-		`woff2`,
+module.exports = async (options, config) => {
+	// override specific options for this plugin
+	options.formats = [
 		`woff`,
-		//`ttf`,
-		//`svg`,
-	],
-}, config) => {
-	const googleFontsPlugin = new GoogleFontsWebpackPlugin({
-		fonts,
-		formats,
-		outputDir: path.join(`.cache/google-fonts`, config.pathPrefix),
-		encode: false,
-		minify: false,
-		verbose: true,
-	})
-	await googleFontsPlugin.make()
-}
+		`woff2`,
+	]
+	options.encode = false // Triggers font-display property
+
+	const googleFontsPluginOptions = new GoogleFontsPluginOptions(options)
+	const outputPath = path.join(`.cache`, `google-fonts`, config.pathPrefix)
+	fs.mkdirSync(outputPath, { recursive: true })
+
+	for (const format of Object.values(googleFontsPluginOptions.formats)) {
+		const fonts = new GoogleFontsPluginFonts(format, googleFontsPluginOptions)
+		let css = await fonts.requestFontsCSS()
+		fs.writeFileSync(path.join(outputPath, `${format}.css`), css)
+	}
+}

plugins/export/merge-css.js

@@ -21,10 +21,6 @@ module.exports = async (config) => {
 
 	let css = createCssString(woff2, woff2Lines)
 	css = new CleanCss().minify(css).styles
-
-	// Add font-display swap as recommended here https://css-tricks.com/font-display-masses/.
-	css = css.replace(/}/g, `;font-display: swap;}`)
-
 	await outputFile(`${cachedPath}/google-fonts.css`, css)
 }