1 files changed, 105 insertions, 0 deletions
diff --git a/scripts/woff2/woff2-vite-plugins.js b/scripts/woff2/woff2-vite-plugins.js
new file mode 100644
index 0000000..c2ed881
--- /dev/null
+++ b/scripts/woff2/woff2-vite-plugins.js
@@ -0,0 +1,105 @@
+// define `EXCALIDRAW_ASSET_PATH` as a SSOT
+const OSS_FONTS_CDN = "/";
+const OSS_FONTS_FALLBACK = "/";
+
+/**
+ * Custom vite plugin for auto-prefixing `EXCALIDRAW_ASSET_PATH` woff2 fonts in `excalidraw-app`.
+ *
+ * @returns {import("vite").PluginOption}
+ */
+module.exports.woff2BrowserPlugin = () => {
+  let isDev;
+
+  return {
+    name: "woff2BrowserPlugin",
+    enforce: "pre",
+    config(_, { command }) {
+      isDev = command === "serve";
+    },
+    transform(code, id) {
+      // using copy / replace as fonts defined in the `.css` don't have to be manually copied over (vite/rollup does this automatically),
+      // but at the same time can't be easily prefixed with the `EXCALIDRAW_ASSET_PATH` only for the `excalidraw-app`
+      if (!isDev && id.endsWith("/excalidraw/fonts/fonts.css")) {
+        return `/* WARN: The following content is generated during excalidraw-app build */
+
+      @font-face {
+        font-family: "Assistant";
+        src: url(${OSS_FONTS_CDN}fonts/Assistant/Assistant-Regular.woff2)
+            format("woff2"),
+          url(./Assistant-Regular.woff2) format("woff2");
+        font-weight: 400;
+        style: normal;
+        display: swap;
+      }
+
+      @font-face {
+        font-family: "Assistant";
+        src: url(${OSS_FONTS_CDN}fonts/Assistant/Assistant-Medium.woff2)
+            format("woff2"),
+          url(./Assistant-Medium.woff2) format("woff2");
+        font-weight: 500;
+        style: normal;
+        display: swap;
+      }
+
+      @font-face {
+        font-family: "Assistant";
+        src: url(${OSS_FONTS_CDN}fonts/Assistant/Assistant-SemiBold.woff2)
+            format("woff2"),
+          url(./Assistant-SemiBold.woff2) format("woff2");
+        font-weight: 600;
+        style: normal;
+        display: swap;
+      }
+
+      @font-face {
+        font-family: "Assistant";
+        src: url(${OSS_FONTS_CDN}fonts/Assistant/Assistant-Bold.woff2)
+            format("woff2"),
+          url(./Assistant-Bold.woff2) format("woff2");
+        font-weight: 700;
+        style: normal;
+        display: swap;
+      }`;
+      }
+
+      if (!isDev && id.endsWith("excalidraw-app/index.html")) {
+        return code.replace(
+          "<!-- PLACEHOLDER:EXCALIDRAW_APP_FONTS -->",
+          `<script>
+        // use app-relative asset paths in prod
+        window.EXCALIDRAW_ASSET_PATH = [
+          "${OSS_FONTS_CDN}",
+          "${OSS_FONTS_FALLBACK}",
+        ];
+      </script>
+
+      <!-- Preload all default fonts to avoid swap on init -->
+      <link
+        rel="preload"
+        href="${OSS_FONTS_CDN}fonts/Excalifont/Excalifont-Regular-a88b72a24fb54c9f94e3b5fdaa7481c9.woff2"
+        as="font"
+        type="font/woff2"
+        crossorigin="anonymous"
+      />
+      <!-- For Nunito only preload the latin range, which should be good enough for now -->
+      <link
+        rel="preload"
+        href="${OSS_FONTS_CDN}fonts/Nunito/Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg.woff2"
+        as="font"
+        type="font/woff2"
+        crossorigin="anonymous"
+      />
+      <link
+        rel="preload"
+        href="${OSS_FONTS_CDN}fonts/ComicShanns/ComicShanns-Regular-279a7b317d12eb88de06167bd672b4b4.woff2"
+        as="font"
+        type="font/woff2"
+        crossorigin="anonymous"
+      />
+    `,
+        );
+      }
+    },
+  };
+};