Use nuxt fonts module

nuxt.config.ts

@@ -3,6 +3,7 @@ export default defineNuxtConfig({
 		"@vueuse/nuxt",
 		"@unocss/nuxt",
 		"@nuxt/icon",
+		"@nuxt/fonts",
 		"nuxt-svgo",
 		"@nuxt/eslint"
 	],
@@ -30,12 +31,20 @@ export default defineNuxtConfig({
 	experimental: {
 		typedPages: true
 	},
+	fonts: {
+		defaults: {
+			weights: [`${100}..${900}`]
+		}
+	},
 	css: [
 		"@unocss/reset/tailwind.css"
 	],
 	svgo: {
 		autoImportPath: "@/assets/"
 	},
+	icon: {
+		mode: "svg"
+	},
 	vite: {
 		clearScreen: false,
 		envPrefix: ["VITE_", "TAURI_"],

package.json

@@ -23,6 +23,7 @@
 		"tauri:build:debug": "tauri build --debug"
 	},
 	"dependencies": {
+		"@nuxt/fonts": "^0.10.0",
 		"@tauri-apps/api": ">=2.0.2",
 		"@tauri-apps/plugin-fs": "^2.0.0",
 		"@tauri-apps/plugin-notification": "^2.0.0",

uno.config.ts

@@ -4,7 +4,6 @@ import {
 	presetTagify,
 	presetTypography,
 	presetUno,
-	presetWebFonts,
 	transformerDirectives,
 	transformerVariantGroup
 } from "unocss";
@@ -20,18 +19,13 @@ export default defineConfig({
 		presetUno(),
 		presetTagify(),
 		presetAttributify(),
-		presetTypography(),
-		presetWebFonts({
-			fonts: {
-				heading: {
-					name: "Montserrat",
-					weights: ["200", "400", "700"]
-				},
-				text: "Inter"
-			}
-		})
+		presetTypography()
 	],
 	theme: {
+		fontFamily: {
+			heading: "Montserrat",
+			text: "Inter"
+		},
 		breakpoints: {
 			sm: "576px",
 			md: "768px",