) {
+ let activeFont = ''
+ for (const font of fonts) {
+ if (editor.marks.fontFamily.isActive({ family: font.family })) {
+ activeFont = font.family
+ break
+ }
+ }
+
+ const handleChange = (value: string) => {
+ if (!value) {
+ editor.commands.removeFontFamily()
+ return
+ }
+ const font = fonts.find((f) => f.family === value)
+ if (font?.google) {
+ loadGoogleFonts()
+ }
+ editor.commands.addFontFamily({ family: value })
+ }
+
+ return { activeFont, handleChange }
+}
+
+export default function Toolbar(): JSX.Element {
+ const state = useEditorDerivedValue(getToolbarState)
+
+ onMount(() => {
+ loadGoogleFonts()
+ })
+
+ return (
+
+
+
+ )
+}
diff --git a/solid-font-family/src/components/editor/sample/sample-doc-font-family.ts b/solid-font-family/src/components/editor/sample/sample-doc-font-family.ts
new file mode 100644
index 0000000000..b175bf2b3d
--- /dev/null
+++ b/solid-font-family/src/components/editor/sample/sample-doc-font-family.ts
@@ -0,0 +1,80 @@
+import type { NodeJSON } from 'prosekit/core'
+
+export const sampleContent: NodeJSON = {
+ type: 'doc',
+ content: [
+ {
+ type: 'paragraph',
+ content: [
+ {
+ type: 'text',
+ text: 'Select text and choose a font from the inline menu. ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Georgia, serif',
+ },
+ },
+ ],
+ text: 'Georgia',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Courier New, monospace',
+ },
+ },
+ ],
+ text: 'Courier New',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Impact, sans-serif',
+ },
+ },
+ ],
+ text: 'Impact',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Comic Sans MS, cursive',
+ },
+ },
+ ],
+ text: 'Comic Sans',
+ },
+ {
+ type: 'text',
+ text: '.',
+ },
+ ],
+ },
+ ],
+}
diff --git a/solid-font-family/src/index.tsx b/solid-font-family/src/index.tsx
new file mode 100644
index 0000000000..92b7740757
--- /dev/null
+++ b/solid-font-family/src/index.tsx
@@ -0,0 +1,8 @@
+/* @refresh reload */
+import './app.css'
+import { render } from 'solid-js/web'
+import App from './App'
+
+const root = document.getElementById('root')
+
+render(() => , root!)
diff --git a/solid-font-family/tsconfig.app.json b/solid-font-family/tsconfig.app.json
new file mode 100644
index 0000000000..c0b480e758
--- /dev/null
+++ b/solid-font-family/tsconfig.app.json
@@ -0,0 +1,29 @@
+{
+ "compilerOptions": {
+ "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+ "target": "ES2022",
+ "useDefineForClassFields": true,
+ "module": "ESNext",
+ "lib": ["ES2022", "DOM", "DOM.Iterable"],
+ "types": ["vite/client"],
+ "skipLibCheck": true,
+
+ /* Bundler mode */
+ "moduleResolution": "bundler",
+ "allowImportingTsExtensions": true,
+ "verbatimModuleSyntax": true,
+ "moduleDetection": "force",
+ "noEmit": true,
+ "jsx": "preserve",
+ "jsxImportSource": "solid-js",
+
+ /* Linting */
+ "strict": true,
+ "noUnusedLocals": true,
+ "noUnusedParameters": true,
+ "erasableSyntaxOnly": true,
+ "noFallthroughCasesInSwitch": true,
+ "noUncheckedSideEffectImports": true
+ },
+ "include": ["src"]
+}
diff --git a/solid-font-family/tsconfig.json b/solid-font-family/tsconfig.json
new file mode 100644
index 0000000000..1ffef600d9
--- /dev/null
+++ b/solid-font-family/tsconfig.json
@@ -0,0 +1,7 @@
+{
+ "files": [],
+ "references": [
+ { "path": "./tsconfig.app.json" },
+ { "path": "./tsconfig.node.json" }
+ ]
+}
diff --git a/solid-font-family/tsconfig.node.json b/solid-font-family/tsconfig.node.json
new file mode 100644
index 0000000000..8a67f62f4c
--- /dev/null
+++ b/solid-font-family/tsconfig.node.json
@@ -0,0 +1,26 @@
+{
+ "compilerOptions": {
+ "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+ "target": "ES2023",
+ "lib": ["ES2023"],
+ "module": "ESNext",
+ "types": ["node"],
+ "skipLibCheck": true,
+
+ /* Bundler mode */
+ "moduleResolution": "bundler",
+ "allowImportingTsExtensions": true,
+ "verbatimModuleSyntax": true,
+ "moduleDetection": "force",
+ "noEmit": true,
+
+ /* Linting */
+ "strict": true,
+ "noUnusedLocals": true,
+ "noUnusedParameters": true,
+ "erasableSyntaxOnly": true,
+ "noFallthroughCasesInSwitch": true,
+ "noUncheckedSideEffectImports": true
+ },
+ "include": ["vite.config.ts"]
+}
diff --git a/solid-font-family/vite.config.ts b/solid-font-family/vite.config.ts
new file mode 100644
index 0000000000..9cb3cb51fd
--- /dev/null
+++ b/solid-font-family/vite.config.ts
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import solid from 'vite-plugin-solid'
+import tailwindcss from '@tailwindcss/vite'
+
+export default defineConfig({
+ plugins: [solid(), tailwindcss()],
+})
diff --git a/svelte-font-family/.gitignore b/svelte-font-family/.gitignore
new file mode 100644
index 0000000000..5d6225c6df
--- /dev/null
+++ b/svelte-font-family/.gitignore
@@ -0,0 +1,4 @@
+node_modules
+dist
+.next
+.svelte-kit
diff --git a/svelte-font-family/README.md b/svelte-font-family/README.md
new file mode 100644
index 0000000000..d640c7fa6c
--- /dev/null
+++ b/svelte-font-family/README.md
@@ -0,0 +1,15 @@
+# svelte-font-family
+
+A [ProseKit](https://prosekit.dev) example.
+
+[](https://stackblitz.com/github/prosekit/examples/tree/master/svelte-font-family)
+[](https://codesandbox.io/p/sandbox/github/prosekit/examples/tree/master/svelte-font-family)
+
+Run the example locally with:
+
+```bash
+npx degit prosekit/examples/svelte-font-family svelte-font-family
+cd svelte-font-family
+npm install
+npm run dev
+```
diff --git a/svelte-font-family/index.html b/svelte-font-family/index.html
new file mode 100644
index 0000000000..58212c2501
--- /dev/null
+++ b/svelte-font-family/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ ProseKit + Svelte
+
+
+
+
+
+
diff --git a/svelte-font-family/package.json b/svelte-font-family/package.json
new file mode 100644
index 0000000000..5bf3398531
--- /dev/null
+++ b/svelte-font-family/package.json
@@ -0,0 +1,28 @@
+{
+ "name": "example-svelte-font-family",
+ "version": "0.0.0",
+ "private": true,
+ "type": "module",
+ "scripts": {
+ "build": "svelte-check --tsconfig ./tsconfig.json && vite build",
+ "dev": "vite",
+ "preview": "vite preview"
+ },
+ "dependencies": {
+ "prosekit": "^0.21.1"
+ },
+ "devDependencies": {
+ "@egoist/tailwindcss-icons": "^1.9.2",
+ "@iconify-json/lucide": "^1.2.107",
+ "@sveltejs/vite-plugin-svelte": "^7.1.2",
+ "@tailwindcss/vite": "^4.3.0",
+ "@tsconfig/svelte": "^5.0.8",
+ "postcss": "^8.5.14",
+ "svelte": "^5.55.7",
+ "svelte-check": "^4.4.8",
+ "tailwindcss": "^4.3.0",
+ "tslib": "^2.8.1",
+ "typescript": "^6.0.3",
+ "vite": "^8.0.13"
+ }
+}
diff --git a/svelte-font-family/src/App.svelte b/svelte-font-family/src/App.svelte
new file mode 100644
index 0000000000..07d0a7c3cc
--- /dev/null
+++ b/svelte-font-family/src/App.svelte
@@ -0,0 +1,5 @@
+
+
+
diff --git a/svelte-font-family/src/app.css b/svelte-font-family/src/app.css
new file mode 100644
index 0000000000..ccad1aefaa
--- /dev/null
+++ b/svelte-font-family/src/app.css
@@ -0,0 +1,12 @@
+@import 'tailwindcss';
+
+@plugin "@egoist/tailwindcss-icons";
+
+body {
+ height: 100svh;
+ display: grid;
+ max-width: 900px;
+ padding: 16px;
+ margin-left: auto;
+ margin-right: auto;
+}
diff --git a/svelte-font-family/src/components/editor/examples/font-family/editor.svelte b/svelte-font-family/src/components/editor/examples/font-family/editor.svelte
new file mode 100644
index 0000000000..bc62906072
--- /dev/null
+++ b/svelte-font-family/src/components/editor/examples/font-family/editor.svelte
@@ -0,0 +1,30 @@
+
+
+
+
+
diff --git a/svelte-font-family/src/components/editor/examples/font-family/extension.ts b/svelte-font-family/src/components/editor/examples/font-family/extension.ts
new file mode 100644
index 0000000000..fc06c6a7c5
--- /dev/null
+++ b/svelte-font-family/src/components/editor/examples/font-family/extension.ts
@@ -0,0 +1,9 @@
+import { defineBasicExtension } from 'prosekit/basic'
+import { union } from 'prosekit/core'
+import { defineFontFamily } from 'prosekit/extensions/font-family'
+
+export function defineExtension() {
+ return union(defineBasicExtension(), defineFontFamily())
+}
+
+export type EditorExtension = ReturnType
diff --git a/svelte-font-family/src/components/editor/examples/font-family/index.ts b/svelte-font-family/src/components/editor/examples/font-family/index.ts
new file mode 100644
index 0000000000..1933e61970
--- /dev/null
+++ b/svelte-font-family/src/components/editor/examples/font-family/index.ts
@@ -0,0 +1 @@
+export { default as ExampleEditor } from './editor.svelte'
diff --git a/svelte-font-family/src/components/editor/examples/font-family/toolbar.svelte b/svelte-font-family/src/components/editor/examples/font-family/toolbar.svelte
new file mode 100644
index 0000000000..4c4467fbc5
--- /dev/null
+++ b/svelte-font-family/src/components/editor/examples/font-family/toolbar.svelte
@@ -0,0 +1,75 @@
+
+
+
+
+
diff --git a/svelte-font-family/src/components/editor/sample/sample-doc-font-family.ts b/svelte-font-family/src/components/editor/sample/sample-doc-font-family.ts
new file mode 100644
index 0000000000..b175bf2b3d
--- /dev/null
+++ b/svelte-font-family/src/components/editor/sample/sample-doc-font-family.ts
@@ -0,0 +1,80 @@
+import type { NodeJSON } from 'prosekit/core'
+
+export const sampleContent: NodeJSON = {
+ type: 'doc',
+ content: [
+ {
+ type: 'paragraph',
+ content: [
+ {
+ type: 'text',
+ text: 'Select text and choose a font from the inline menu. ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Georgia, serif',
+ },
+ },
+ ],
+ text: 'Georgia',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Courier New, monospace',
+ },
+ },
+ ],
+ text: 'Courier New',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Impact, sans-serif',
+ },
+ },
+ ],
+ text: 'Impact',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Comic Sans MS, cursive',
+ },
+ },
+ ],
+ text: 'Comic Sans',
+ },
+ {
+ type: 'text',
+ text: '.',
+ },
+ ],
+ },
+ ],
+}
diff --git a/svelte-font-family/src/main.ts b/svelte-font-family/src/main.ts
new file mode 100644
index 0000000000..b4bc565380
--- /dev/null
+++ b/svelte-font-family/src/main.ts
@@ -0,0 +1,8 @@
+import './app.css'
+
+import { mount } from 'svelte'
+import App from './App.svelte'
+
+const app = mount(App, { target: document.getElementById('app')! })
+
+export default app
diff --git a/svelte-font-family/src/vite-env.d.ts b/svelte-font-family/src/vite-env.d.ts
new file mode 100644
index 0000000000..4078e7476a
--- /dev/null
+++ b/svelte-font-family/src/vite-env.d.ts
@@ -0,0 +1,2 @@
+///
+///
diff --git a/svelte-font-family/svelte.config.js b/svelte-font-family/svelte.config.js
new file mode 100644
index 0000000000..b0683fd24d
--- /dev/null
+++ b/svelte-font-family/svelte.config.js
@@ -0,0 +1,7 @@
+import { vitePreprocess } from '@sveltejs/vite-plugin-svelte'
+
+export default {
+ // Consult https://svelte.dev/docs#compile-time-svelte-preprocess
+ // for more information about preprocessors
+ preprocess: vitePreprocess(),
+}
diff --git a/svelte-font-family/tsconfig.json b/svelte-font-family/tsconfig.json
new file mode 100644
index 0000000000..86876593dd
--- /dev/null
+++ b/svelte-font-family/tsconfig.json
@@ -0,0 +1,21 @@
+{
+ "extends": "@tsconfig/svelte/tsconfig.json",
+ "compilerOptions": {
+ "target": "ESNext",
+ "useDefineForClassFields": true,
+ "module": "ESNext",
+ "resolveJsonModule": true,
+ /**
+ * Typecheck JS in `.svelte` and `.js` files by default.
+ * Disable checkJs if you'd like to use dynamic types in JS.
+ * Note that setting allowJs false does not prevent the use
+ * of JS in `.svelte` files.
+ */
+ "allowJs": true,
+ "checkJs": true,
+ "allowImportingTsExtensions": true,
+ "isolatedModules": true
+ },
+ "include": ["src/**/*.ts", "src/**/*.js", "src/**/*.svelte"],
+ "references": [{ "path": "./tsconfig.node.json" }]
+}
diff --git a/svelte-font-family/tsconfig.node.json b/svelte-font-family/tsconfig.node.json
new file mode 100644
index 0000000000..494bfe0835
--- /dev/null
+++ b/svelte-font-family/tsconfig.node.json
@@ -0,0 +1,9 @@
+{
+ "compilerOptions": {
+ "composite": true,
+ "skipLibCheck": true,
+ "module": "ESNext",
+ "moduleResolution": "bundler"
+ },
+ "include": ["vite.config.ts"]
+}
diff --git a/svelte-font-family/vite.config.ts b/svelte-font-family/vite.config.ts
new file mode 100644
index 0000000000..11edea7f23
--- /dev/null
+++ b/svelte-font-family/vite.config.ts
@@ -0,0 +1,8 @@
+import { defineConfig } from 'vite'
+import { svelte } from '@sveltejs/vite-plugin-svelte'
+import tailwindcss from '@tailwindcss/vite'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+ plugins: [svelte(), tailwindcss()],
+})
diff --git a/vue-font-family/.gitignore b/vue-font-family/.gitignore
new file mode 100644
index 0000000000..5d6225c6df
--- /dev/null
+++ b/vue-font-family/.gitignore
@@ -0,0 +1,4 @@
+node_modules
+dist
+.next
+.svelte-kit
diff --git a/vue-font-family/README.md b/vue-font-family/README.md
new file mode 100644
index 0000000000..8ca69b4f41
--- /dev/null
+++ b/vue-font-family/README.md
@@ -0,0 +1,15 @@
+# vue-font-family
+
+A [ProseKit](https://prosekit.dev) example.
+
+[](https://stackblitz.com/github/prosekit/examples/tree/master/vue-font-family)
+[](https://codesandbox.io/p/sandbox/github/prosekit/examples/tree/master/vue-font-family)
+
+Run the example locally with:
+
+```bash
+npx degit prosekit/examples/vue-font-family vue-font-family
+cd vue-font-family
+npm install
+npm run dev
+```
diff --git a/vue-font-family/index.html b/vue-font-family/index.html
new file mode 100644
index 0000000000..d8952bb9e6
--- /dev/null
+++ b/vue-font-family/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ ProseKit + Vue
+
+
+
+
+
+
diff --git a/vue-font-family/package.json b/vue-font-family/package.json
new file mode 100644
index 0000000000..c9989eb3e6
--- /dev/null
+++ b/vue-font-family/package.json
@@ -0,0 +1,27 @@
+{
+ "name": "example-vue-font-family",
+ "version": "0.0.0",
+ "private": true,
+ "type": "module",
+ "scripts": {
+ "build": "vue-tsc -b && vite build",
+ "dev": "vite",
+ "preview": "vite preview"
+ },
+ "dependencies": {
+ "prosekit": "^0.21.1",
+ "vue": "^3.5.34"
+ },
+ "devDependencies": {
+ "@egoist/tailwindcss-icons": "^1.9.2",
+ "@iconify-json/lucide": "^1.2.107",
+ "@tailwindcss/vite": "^4.3.0",
+ "@types/node": "^24.12.4",
+ "@vitejs/plugin-vue": "^6.0.6",
+ "@vue/tsconfig": "^0.9.1",
+ "tailwindcss": "^4.3.0",
+ "typescript": "^6.0.3",
+ "vite": "^8.0.13",
+ "vue-tsc": "^3.2.8"
+ }
+}
diff --git a/vue-font-family/src/App.vue b/vue-font-family/src/App.vue
new file mode 100644
index 0000000000..a7a2c28ebb
--- /dev/null
+++ b/vue-font-family/src/App.vue
@@ -0,0 +1,7 @@
+
+
+
+
+
diff --git a/vue-font-family/src/app.css b/vue-font-family/src/app.css
new file mode 100644
index 0000000000..ccad1aefaa
--- /dev/null
+++ b/vue-font-family/src/app.css
@@ -0,0 +1,12 @@
+@import 'tailwindcss';
+
+@plugin "@egoist/tailwindcss-icons";
+
+body {
+ height: 100svh;
+ display: grid;
+ max-width: 900px;
+ padding: 16px;
+ margin-left: auto;
+ margin-right: auto;
+}
diff --git a/vue-font-family/src/components/editor/examples/font-family/editor.vue b/vue-font-family/src/components/editor/examples/font-family/editor.vue
new file mode 100644
index 0000000000..b855a2e7ab
--- /dev/null
+++ b/vue-font-family/src/components/editor/examples/font-family/editor.vue
@@ -0,0 +1,36 @@
+
+
+
+
+
+
+
diff --git a/vue-font-family/src/components/editor/examples/font-family/extension.ts b/vue-font-family/src/components/editor/examples/font-family/extension.ts
new file mode 100644
index 0000000000..fc06c6a7c5
--- /dev/null
+++ b/vue-font-family/src/components/editor/examples/font-family/extension.ts
@@ -0,0 +1,9 @@
+import { defineBasicExtension } from 'prosekit/basic'
+import { union } from 'prosekit/core'
+import { defineFontFamily } from 'prosekit/extensions/font-family'
+
+export function defineExtension() {
+ return union(defineBasicExtension(), defineFontFamily())
+}
+
+export type EditorExtension = ReturnType
diff --git a/vue-font-family/src/components/editor/examples/font-family/index.ts b/vue-font-family/src/components/editor/examples/font-family/index.ts
new file mode 100644
index 0000000000..dcc4cb6219
--- /dev/null
+++ b/vue-font-family/src/components/editor/examples/font-family/index.ts
@@ -0,0 +1 @@
+export { default as ExampleEditor } from './editor.vue'
diff --git a/vue-font-family/src/components/editor/examples/font-family/toolbar.vue b/vue-font-family/src/components/editor/examples/font-family/toolbar.vue
new file mode 100644
index 0000000000..86ff0e069a
--- /dev/null
+++ b/vue-font-family/src/components/editor/examples/font-family/toolbar.vue
@@ -0,0 +1,87 @@
+
+
+
+
+
+
+
diff --git a/vue-font-family/src/components/editor/sample/sample-doc-font-family.ts b/vue-font-family/src/components/editor/sample/sample-doc-font-family.ts
new file mode 100644
index 0000000000..b175bf2b3d
--- /dev/null
+++ b/vue-font-family/src/components/editor/sample/sample-doc-font-family.ts
@@ -0,0 +1,80 @@
+import type { NodeJSON } from 'prosekit/core'
+
+export const sampleContent: NodeJSON = {
+ type: 'doc',
+ content: [
+ {
+ type: 'paragraph',
+ content: [
+ {
+ type: 'text',
+ text: 'Select text and choose a font from the inline menu. ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Georgia, serif',
+ },
+ },
+ ],
+ text: 'Georgia',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Courier New, monospace',
+ },
+ },
+ ],
+ text: 'Courier New',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Impact, sans-serif',
+ },
+ },
+ ],
+ text: 'Impact',
+ },
+ {
+ type: 'text',
+ text: ', ',
+ },
+ {
+ type: 'text',
+ marks: [
+ {
+ type: 'fontFamily',
+ attrs: {
+ family: 'Comic Sans MS, cursive',
+ },
+ },
+ ],
+ text: 'Comic Sans',
+ },
+ {
+ type: 'text',
+ text: '.',
+ },
+ ],
+ },
+ ],
+}
diff --git a/vue-font-family/src/main.ts b/vue-font-family/src/main.ts
new file mode 100644
index 0000000000..0ed1fdfef8
--- /dev/null
+++ b/vue-font-family/src/main.ts
@@ -0,0 +1,5 @@
+import './app.css'
+import { createApp } from 'vue'
+import App from './App.vue'
+
+createApp(App).mount('#app')
diff --git a/vue-font-family/tsconfig.app.json b/vue-font-family/tsconfig.app.json
new file mode 100644
index 0000000000..7c0e5ef3a8
--- /dev/null
+++ b/vue-font-family/tsconfig.app.json
@@ -0,0 +1,16 @@
+{
+ "extends": "@vue/tsconfig/tsconfig.dom.json",
+ "compilerOptions": {
+ "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
+ "types": ["vite/client"],
+ "lib": ["ES2022", "DOM", "DOM.Iterable"],
+ /* Linting */
+ "strict": true,
+ "noUnusedLocals": true,
+ "noUnusedParameters": true,
+ "erasableSyntaxOnly": true,
+ "noFallthroughCasesInSwitch": true,
+ "noUncheckedSideEffectImports": true
+ },
+ "include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"]
+}
diff --git a/vue-font-family/tsconfig.json b/vue-font-family/tsconfig.json
new file mode 100644
index 0000000000..1ffef600d9
--- /dev/null
+++ b/vue-font-family/tsconfig.json
@@ -0,0 +1,7 @@
+{
+ "files": [],
+ "references": [
+ { "path": "./tsconfig.app.json" },
+ { "path": "./tsconfig.node.json" }
+ ]
+}
diff --git a/vue-font-family/tsconfig.node.json b/vue-font-family/tsconfig.node.json
new file mode 100644
index 0000000000..8a67f62f4c
--- /dev/null
+++ b/vue-font-family/tsconfig.node.json
@@ -0,0 +1,26 @@
+{
+ "compilerOptions": {
+ "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
+ "target": "ES2023",
+ "lib": ["ES2023"],
+ "module": "ESNext",
+ "types": ["node"],
+ "skipLibCheck": true,
+
+ /* Bundler mode */
+ "moduleResolution": "bundler",
+ "allowImportingTsExtensions": true,
+ "verbatimModuleSyntax": true,
+ "moduleDetection": "force",
+ "noEmit": true,
+
+ /* Linting */
+ "strict": true,
+ "noUnusedLocals": true,
+ "noUnusedParameters": true,
+ "erasableSyntaxOnly": true,
+ "noFallthroughCasesInSwitch": true,
+ "noUncheckedSideEffectImports": true
+ },
+ "include": ["vite.config.ts"]
+}
diff --git a/vue-font-family/vite.config.ts b/vue-font-family/vite.config.ts
new file mode 100644
index 0000000000..2e9084402d
--- /dev/null
+++ b/vue-font-family/vite.config.ts
@@ -0,0 +1,8 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+import tailwindcss from '@tailwindcss/vite'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+ plugins: [vue(), tailwindcss()],
+})