Attempting to dynamically load fonts from the assets directory within Vue 3 (Typescript) using Vite has led to a 404 error occurring.
https://i.sstatic.net/H3Ho7.png
const fonts = import.meta.glob('@/assets/fonts/*.otf')
console.log(fonts)
async function loadFonts() {
for (const path in fonts) {
const fontName = path.split('/')[3].split('-')[0]
console.log(fontName)
const myFont = new FontFace(fontName, `url('${path}')`)
await myFont.load()
document.fonts.add(myFont)
console.log(myFont)
}
}
loadFonts()