diff --git a/.gitignore b/.gitignore index 082c50554..981d03813 100644 --- a/.gitignore +++ b/.gitignore @@ -124,8 +124,9 @@ updateContributors.mjs copyAnticheatToDev.sh -# ignore generated fonts +# ignore generated fonts (not needed anymore, can be removed later) frontend/src/webfonts-generated +frontend/static/webfonts-preview .turbo frontend/.env.sentry-build-plugin diff --git a/frontend/package.json b/frontend/package.json index 0bd6fc1c3..c14cc02b4 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -84,7 +84,7 @@ "eslint": "9.39.1", "eslint-plugin-compat": "6.0.2", "firebase-tools": "13.15.1", - "fontawesome-subset": "4.4.0", + "fontawesome-subset": "4.6.0", "happy-dom": "20.0.10", "madge": "8.0.0", "magic-string": "0.30.17", diff --git a/frontend/src/styles/fontawesome-5.scss b/frontend/src/styles/fontawesome-5.scss index 933587471..c90d79033 100644 --- a/frontend/src/styles/fontawesome-5.scss +++ b/frontend/src/styles/fontawesome-5.scss @@ -16,7 +16,7 @@ @if variable-exists(fontAwesomeOverride) { src: url("#{$fontAwesomeOverride}/fa-solid-900.woff2") format("woff2"); } @else { - src: url("/webfonts-generated/fa-solid-900.woff2") format("woff2"); + src: url("/webfonts/fa-solid-900.woff2") format("woff2"); } } @@ -27,7 +27,7 @@ @if variable-exists(fontAwesomeOverride) { src: url("#{$fontAwesomeOverride}/fa-regular-400.woff2") format("woff2"); } @else { - src: url("/webfonts-generated/fa-regular-400.woff2") format("woff2"); + src: url("/webfonts/fa-regular-400.woff2") format("woff2"); } } @@ -54,7 +54,7 @@ @if variable-exists(fontAwesomeOverride) { src: url("#{$fontAwesomeOverride}/fa-brands-400.woff2") format("woff2"); } @else { - src: url("/webfonts-generated/fa-brands-400.woff2") format("woff2"); + src: url("/webfonts/fa-brands-400.woff2") format("woff2"); } } diff --git a/frontend/src/styles/fontawesome-6.scss b/frontend/src/styles/fontawesome-6.scss index 55f8f5820..458f3c7c3 100644 --- a/frontend/src/styles/fontawesome-6.scss +++ b/frontend/src/styles/fontawesome-6.scss @@ -20,7 +20,7 @@ @if variable-exists(fontAwesomeOverride) { src: url("#{$fontAwesomeOverride}/fa-solid-900.woff2") format("woff2"); } @else { - src: url("/webfonts-generated/fa-solid-900.woff2") format("woff2"); + src: url("/webfonts/fa-solid-900.woff2") format("woff2"); } } @@ -31,7 +31,7 @@ @if variable-exists(fontAwesomeOverride) { src: url("#{$fontAwesomeOverride}/fa-regular-400.woff2") format("woff2"); } @else { - src: url("/webfonts-generated/fa-regular-400.woff2") format("woff2"); + src: url("/webfonts/fa-regular-400.woff2") format("woff2"); } } @@ -58,7 +58,7 @@ @if variable-exists(fontAwesomeOverride) { src: url("#{$fontAwesomeOverride}/fa-brands-400.woff2") format("woff2"); } @else { - src: url("/webfonts-generated/fa-brands-400.woff2") format("woff2"); + src: url("/webfonts/fa-brands-400.woff2") format("woff2"); } } diff --git a/frontend/vite-plugins/fontawesome-subset.ts b/frontend/vite-plugins/fontawesome-subset.ts index 49b0e1f2c..9c472123a 100644 --- a/frontend/vite-plugins/fontawesome-subset.ts +++ b/frontend/vite-plugins/fontawesome-subset.ts @@ -13,18 +13,31 @@ export function fontawesomeSubset(): Plugin { return { name: "vite-plugin-fontawesome-subset", apply: "build", - async buildStart() { + async generateBundle() { const start = performance.now(); console.log("\nCreating fontawesome subset..."); - const fontawesomeClasses = getFontawesomeConfig(); - await createFontawesomeSubset( - fontawesomeClasses, - "src/webfonts-generated", - { + const tempDir = fs.mkdtempSync("fontawesome-preview-"); + try { + const fontawesomeClasses = getFontawesomeConfig(); + await createFontawesomeSubset(fontawesomeClasses, tempDir, { targetFormats: ["woff2"], - }, - ); + }); + + const entries = fs.readdirSync(tempDir, { withFileTypes: true }); + + for (const entry of entries) { + if (!entry.isFile()) continue; + + this.emitFile({ + type: "asset", + fileName: "webfonts/" + entry.name, + source: fs.readFileSync(path.join(tempDir, entry.name), "utf8"), + }); + } + } finally { + fs.rmSync(tempDir, { recursive: true, force: true }); + } const end = performance.now(); console.log( diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts index 1b59f770f..673db99a6 100644 --- a/frontend/vite.config.ts +++ b/frontend/vite.config.ts @@ -82,6 +82,7 @@ function getPlugins({ envConfig({ isDevelopment, clientVersion, env }), languageHashes({ skip: isDevelopment }), fontPreview(), + fontawesomeSubset(), versionFile({ clientVersion }), checker({ oxlint: { @@ -98,7 +99,6 @@ function getPlugins({ const devPlugins: PluginOption[] = [Inspect()]; const prodPlugins: PluginOption[] = [ - fontawesomeSubset(), ViteMinifyPlugin(), VitePWA({ // injectRegister: "networkfirst", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0577166a4..0eb2758dd 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -416,8 +416,8 @@ importers: specifier: 13.15.1 version: 13.15.1(encoding@0.1.13) fontawesome-subset: - specifier: 4.4.0 - version: 4.4.0(@fortawesome/fontawesome-free@5.15.4) + specifier: 4.6.0 + version: 4.6.0(@fortawesome/fontawesome-free@5.15.4) happy-dom: specifier: 20.0.10 version: 20.0.10 @@ -5226,8 +5226,8 @@ packages: debug: optional: true - fontawesome-subset@4.4.0: - resolution: {integrity: sha512-kcK1ELa/Gq4R2+gKxzeFbLl0uzSJBeWsjtZPLLf5mCJEfTY9gt/lAOgW7opGaG1ZaFMa88Qu1ghuRsLUkmobYg==} + fontawesome-subset@4.6.0: + resolution: {integrity: sha512-StfmCPwQUUt9wsIJDK404QDz/FkidvpNB5mZy2X36DRPorgXj9VslUwdlijxrHqPIXoA0baC0ucvdOCEQeIHEQ==} peerDependencies: '@fortawesome/fontawesome-free': '>=5.12.0' '@fortawesome/fontawesome-pro': '>=5.12.0' @@ -14874,12 +14874,12 @@ snapshots: optionalDependencies: debug: 4.3.6(supports-color@5.5.0) - fontawesome-subset@4.4.0(@fortawesome/fontawesome-free@5.15.4): + fontawesome-subset@4.6.0(@fortawesome/fontawesome-free@5.15.4): dependencies: lodash: 4.17.21 mkdirp: 2.1.6 subset-font: 2.3.0 - yaml: 2.5.0 + yaml: 2.8.1 optionalDependencies: '@fortawesome/fontawesome-free': 5.15.4