diff --git a/.gitignore b/.gitignore index 69060a26..d8bec488 100644 --- a/.gitignore +++ b/.gitignore @@ -35,4 +35,4 @@ yarn-error.log* .vercel # external fonts -public/fonts/Optimistic_*.woff2 +public/fonts/**/Optimistic_*.woff2 diff --git a/package.json b/package.json index b6a78db5..f4f9a802 100644 --- a/package.json +++ b/package.json @@ -6,7 +6,7 @@ "scripts": { "analyze": "ANALYZE=true next build", "dev": "next-remote-watch ./src/content", - "build": "next build && node ./scripts/downloadFonts.js", + "build": "next build && node --experimental-modules ./scripts/downloadFonts.mjs", "lint": "next lint", "lint:fix": "next lint --fix", "format:source": "prettier --config .prettierrc --write \"{plugins,src}/**/*.{js,ts,jsx,tsx,css}\"", diff --git a/scripts/downloadFonts.js b/scripts/downloadFonts.js deleted file mode 100644 index 62fe5bca..00000000 --- a/scripts/downloadFonts.js +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Copyright (c) Facebook, Inc. and its affiliates. - */ - -const {execSync} = require('child_process'); - -// So that we don't need to check them into the repo. -// Serving them from the same domain is better for perf so do this on deploy. -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Display_W_Lt.woff2 --output public/fonts/Optimistic_Display_W_Lt.woff2' -); -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Display_W_Md.woff2 --output public/fonts/Optimistic_Display_W_Md.woff2' -); -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Display_W_Bd.woff2 --output public/fonts/Optimistic_Display_W_Bd.woff2' -); -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Display_W_SBd.woff2 --output public/fonts/Optimistic_Display_W_SBd.woff2' -); -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Text_W_Rg.woff2 --output public/fonts/Optimistic_Text_W_Rg.woff2' -); -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Text_W_Md.woff2 --output public/fonts/Optimistic_Text_W_Md.woff2' -); -execSync( - 'curl https://conf.reactjs.org/fonts/Optimistic_Text_W_Bd.woff2 --output public/fonts/Optimistic_Text_W_Bd.woff2' -); diff --git a/scripts/downloadFonts.mjs b/scripts/downloadFonts.mjs new file mode 100644 index 00000000..008a3810 --- /dev/null +++ b/scripts/downloadFonts.mjs @@ -0,0 +1,75 @@ +/** + * Copyright (c) Facebook, Inc. and its affiliates. + */ + +import { exec } from 'child_process'; +import { mkdir, promises as fsPromises } from 'fs'; +import { dirname } from 'path'; +import { promisify } from 'util'; + +const execAsync = promisify(exec); + +// Taken from Downloads on https://www.facebook.com/brand/meta/typography/. +// To refresh the list, go to the Conf website's public/fonts/ folder and run this: +// printf "\n[\n%s\n]\n" "$(find . -type f ! -path "*/.*" -name "*.woff2" | sed 's|^./||' | sort | awk '{printf " \"%s\",\n", $0}' | sed '$s/,$//')" +const paths = [ + "Optimistic_Display_W_Bd.woff2", + "Optimistic_Display_W_BdIt.woff2", + "Optimistic_Display_W_Lt.woff2", + "Optimistic_Display_W_Md.woff2", + "Optimistic_Display_W_MdIt.woff2", + "Optimistic_Display_W_SBd.woff2", + "Optimistic_Display_W_SBdIt.woff2", + "Optimistic_Display_W_XBd.woff2", + "Optimistic_Display_W_XLt.woff2", + "Optimistic_Text_W_Bd.woff2", + "Optimistic_Text_W_BdIt.woff2", + "Optimistic_Text_W_It.woff2", + "Optimistic_Text_W_Md.woff2", + "Optimistic_Text_W_MdIt.woff2", + "Optimistic_Text_W_Rg.woff2", + "Optimistic_Text_W_XBd.woff2", + "Optimistic_Text_W_XBdIt.woff2", + "arabic/Optimistic_Display_Arbc_W_Bd.woff2", + "arabic/Optimistic_Display_Arbc_W_Md.woff2", + "arabic/Optimistic_Display_Arbc_W_SBd.woff2", + "arabic/Optimistic_Text_Arbc_W_Bd.woff2", + "arabic/Optimistic_Text_Arbc_W_Md.woff2", + "arabic/Optimistic_Text_Arbc_W_Rg.woff2", + "arabic/Optimistic_Text_Arbc_W_XBd.woff2", + "cyrillic/Optimistic_Display_Cyrl_W_Bd.woff2", + "cyrillic/Optimistic_Display_Cyrl_W_Md.woff2", + "cyrillic/Optimistic_Display_Cyrl_W_SBd.woff2", + "cyrillic/Optimistic_Text_Cyrl_W_Bd.woff2", + "cyrillic/Optimistic_Text_Cyrl_W_Md.woff2", + "cyrillic/Optimistic_Text_Cyrl_W_Rg.woff2", + "cyrillic/Optimistic_Text_Cyrl_W_XBd.woff2", + "devanagari/Optimistic_Text_Deva_W_Bd.woff2", + "devanagari/Optimistic_Text_Deva_W_Md.woff2", + "devanagari/Optimistic_Text_Deva_W_Rg.woff2", + "devanagari/Optimistic_Text_Deva_W_XBd.woff2", + "vietnamese/Optimistic_Display_Viet_W_Bd.woff2", + "vietnamese/Optimistic_Display_Viet_W_Md.woff2", + "vietnamese/Optimistic_Display_Viet_W_SBd.woff2", + "vietnamese/Optimistic_Text_Viet_W_Bd.woff2", + "vietnamese/Optimistic_Text_Viet_W_Md.woff2", + "vietnamese/Optimistic_Text_Viet_W_Rg.woff2", + "vietnamese/Optimistic_Text_Viet_W_XBd.woff2" +]; + +const baseURL = "https://conf.reactjs.org/fonts/"; +const outputDir = "public/fonts/"; + +await Promise.all( + paths.map(async (path) => { + const localPath = `${outputDir}${path}`; + const localDir = dirname(localPath); + await fsPromises.mkdir(localDir, { recursive: true }); + + const command = `curl ${baseURL}${path} --output ${localPath}`; + await execAsync(command); + console.log(`Downloaded ${path}`); + }) +); + +console.log("All fonts downloaded.");