mirror of
https://github.com/excalidraw/excalidraw.git
synced 2025-05-03 10:00:07 -04:00
feat: self-hosting existing google fonts (#8540)
This commit is contained in:
parent
6dfa18414a
commit
a80cb5896a
18 changed files with 47 additions and 200 deletions
|
@ -1,15 +1,13 @@
|
|||
// `EXCALIDRAW_ASSET_PATH` as a SSOT
|
||||
const OSS_FONTS_CDN =
|
||||
"https://excalidraw.nyc3.cdn.digitaloceanspaces.com/fonts/oss/";
|
||||
|
||||
/**
|
||||
* Custom vite plugin to convert url woff2 imports into a text.
|
||||
* Other woff2 imports are automatically served and resolved as a file uri.
|
||||
* Custom vite plugin for auto-prefixing `EXCALIDRAW_ASSET_PATH` woff2 fonts in `excalidraw-app`.
|
||||
*
|
||||
* @returns {import("vite").PluginOption}
|
||||
*/
|
||||
module.exports.woff2BrowserPlugin = () => {
|
||||
// for now limited to woff2 only, might be extended to any assets in the future
|
||||
const regex = /^https:\/\/.+?\.woff2$/;
|
||||
let isDev;
|
||||
|
||||
return {
|
||||
|
@ -18,34 +16,9 @@ module.exports.woff2BrowserPlugin = () => {
|
|||
config(_, { command }) {
|
||||
isDev = command === "serve";
|
||||
},
|
||||
resolveId(source) {
|
||||
if (!regex.test(source)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// getting the url to the dependency tree
|
||||
return source;
|
||||
},
|
||||
load(id) {
|
||||
if (!regex.test(id)) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// loading the url as string
|
||||
return `export default "${id}"`;
|
||||
},
|
||||
// necessary for dev as vite / rollup does skips https imports in serve (~dev) mode
|
||||
// aka dev mode equivalent of "export default x" above (resolveId + load)
|
||||
transform(code, id) {
|
||||
// treat https woff2 imports as a text
|
||||
if (isDev && id.endsWith("/excalidraw/fonts/index.ts")) {
|
||||
return code.replaceAll(
|
||||
/import\s+(\w+)\s+from\s+(["']https:\/\/.+?\.woff2["'])/g,
|
||||
`const $1 = $2`,
|
||||
);
|
||||
}
|
||||
|
||||
// use CDN for Assistant
|
||||
// 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/assets/fonts.css")) {
|
||||
return `/* WARN: The following content is generated during excalidraw-app build */
|
||||
|
||||
|
@ -90,7 +63,6 @@ module.exports.woff2BrowserPlugin = () => {
|
|||
}`;
|
||||
}
|
||||
|
||||
// using EXCALIDRAW_ASSET_PATH as a SSOT
|
||||
if (!isDev && id.endsWith("excalidraw-app/index.html")) {
|
||||
return code.replace(
|
||||
"<!-- PLACEHOLDER:EXCALIDRAW_APP_FONTS -->",
|
||||
|
@ -110,9 +82,10 @@ module.exports.woff2BrowserPlugin = () => {
|
|||
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}Virgil-Regular-hO16qHwV.woff2"
|
||||
href="${OSS_FONTS_CDN}Nunito-Regular-XRXI3I6Li01BKofiOc5wtlZ2di8HDIkhdTQ3j6zbXWjgeg-DqUjjPte.woff2"
|
||||
as="font"
|
||||
type="font/woff2"
|
||||
crossorigin="anonymous"
|
||||
|
@ -124,6 +97,13 @@ module.exports.woff2BrowserPlugin = () => {
|
|||
type="font/woff2"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
<link
|
||||
rel="preload"
|
||||
href="${OSS_FONTS_CDN}Virgil-Regular-hO16qHwV.woff2"
|
||||
as="font"
|
||||
type="font/woff2"
|
||||
crossorigin="anonymous"
|
||||
/>
|
||||
`,
|
||||
);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue