From b7e2ce8c26d14ff74d51d1599cf1191a3621da75 Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Thu, 17 Apr 2025 13:09:15 +0200 Subject: [PATCH 1/7] Move type declaration into definition file --- resources/js/types/globals.d.ts | 13 +++++++++++++ 1 file changed, 13 insertions(+) diff --git a/resources/js/types/globals.d.ts b/resources/js/types/globals.d.ts index 36425cf1..7e4ba241 100644 --- a/resources/js/types/globals.d.ts +++ b/resources/js/types/globals.d.ts @@ -24,3 +24,16 @@ declare module '@vue/runtime-core' { $headManager: ReturnType; } } + +// Extend ImportMeta interface for Vite... +declare module 'vite/client' { + interface ImportMetaEnv { + readonly VITE_APP_NAME: string; + [key: string]: string | boolean | undefined; + } + + interface ImportMeta { + readonly env: ImportMetaEnv; + readonly glob: (pattern: string) => Record Promise>; + } +} From ecd5488d304cdccb92e57a2a3efdacb1afa8692a Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Thu, 24 Apr 2025 14:45:06 +0200 Subject: [PATCH 2/7] Refactor page props: Allows usage of usePage without having to explicitly type the props --- resources/js/types/globals.d.ts | 23 +---------------------- 1 file changed, 1 insertion(+), 22 deletions(-) diff --git a/resources/js/types/globals.d.ts b/resources/js/types/globals.d.ts index 7e4ba241..be9dc4bb 100644 --- a/resources/js/types/globals.d.ts +++ b/resources/js/types/globals.d.ts @@ -15,25 +15,4 @@ declare module 'vite/client' { declare module '@inertiajs/core' { interface PageProps extends InertiaPageProps, AppPageProps {} -} - -declare module '@vue/runtime-core' { - interface ComponentCustomProperties { - $inertia: typeof Router; - $page: Page; - $headManager: ReturnType; - } -} - -// Extend ImportMeta interface for Vite... -declare module 'vite/client' { - interface ImportMetaEnv { - readonly VITE_APP_NAME: string; - [key: string]: string | boolean | undefined; - } - - interface ImportMeta { - readonly env: ImportMetaEnv; - readonly glob: (pattern: string) => Record Promise>; - } -} +} \ No newline at end of file From e0e2f9623a59ee52cf8f6b40554270cf3ef44604 Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Thu, 24 Apr 2025 14:46:09 +0200 Subject: [PATCH 3/7] Simplify route type --- resources/js/types/globals.d.ts | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/resources/js/types/globals.d.ts b/resources/js/types/globals.d.ts index be9dc4bb..0dc41dbf 100644 --- a/resources/js/types/globals.d.ts +++ b/resources/js/types/globals.d.ts @@ -15,4 +15,13 @@ declare module 'vite/client' { declare module '@inertiajs/core' { interface PageProps extends InertiaPageProps, AppPageProps {} -} \ No newline at end of file +} + +declare module '@vue/runtime-core' { + interface ComponentCustomProperties { + $inertia: typeof Router; + $page: Page; + $headManager: ReturnType; + route: AppRouter; + } +} From e5b47d4d7f330de0f6be5550efd5f5cf861aae57 Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Thu, 24 Apr 2025 14:52:21 +0200 Subject: [PATCH 4/7] Simplify ssr logic: Removed unnecessary config and route declaration --- resources/js/ssr.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/resources/js/ssr.ts b/resources/js/ssr.ts index f1efcfde..5f52e3ba 100644 --- a/resources/js/ssr.ts +++ b/resources/js/ssr.ts @@ -2,7 +2,7 @@ import { createInertiaApp } from '@inertiajs/vue3'; import createServer from '@inertiajs/vue3/server'; import { renderToString } from '@vue/server-renderer'; import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers'; -import { createSSRApp, DefineComponent, h } from 'vue'; +import { createApp, DefineComponent, h } from 'vue'; import { ZiggyVue } from 'ziggy-js'; const appName = import.meta.env.VITE_APP_NAME || 'Laravel'; @@ -14,14 +14,13 @@ createServer((page) => title: (title) => `${title} - ${appName}`, resolve: resolvePage, setup: ({ App, props, plugin }) => - createSSRApp({ render: () => h(App, props) }) + createApp({ render: () => h(App, props) }) .use(plugin) .use(ZiggyVue, { ...page.props.ziggy, location: new URL(page.props.ziggy.location), }), }), - { cluster: true }, ); function resolvePage(name: string) { From ff86b7b470ed61460ba21d41b0d49d79f6876357 Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Thu, 24 Apr 2025 15:13:44 +0200 Subject: [PATCH 5/7] Fix createSSRApp call and set clustering to true --- resources/js/ssr.ts | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/resources/js/ssr.ts b/resources/js/ssr.ts index 5f52e3ba..f1efcfde 100644 --- a/resources/js/ssr.ts +++ b/resources/js/ssr.ts @@ -2,7 +2,7 @@ import { createInertiaApp } from '@inertiajs/vue3'; import createServer from '@inertiajs/vue3/server'; import { renderToString } from '@vue/server-renderer'; import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers'; -import { createApp, DefineComponent, h } from 'vue'; +import { createSSRApp, DefineComponent, h } from 'vue'; import { ZiggyVue } from 'ziggy-js'; const appName = import.meta.env.VITE_APP_NAME || 'Laravel'; @@ -14,13 +14,14 @@ createServer((page) => title: (title) => `${title} - ${appName}`, resolve: resolvePage, setup: ({ App, props, plugin }) => - createApp({ render: () => h(App, props) }) + createSSRApp({ render: () => h(App, props) }) .use(plugin) .use(ZiggyVue, { ...page.props.ziggy, location: new URL(page.props.ziggy.location), }), }), + { cluster: true }, ); function resolvePage(name: string) { From f3a358e9af09bce1e142d40b100a6bc266568465 Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Thu, 24 Apr 2025 19:16:53 +0200 Subject: [PATCH 6/7] Remove type duplicate (see ziggy.d.ts) --- resources/js/types/globals.d.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/resources/js/types/globals.d.ts b/resources/js/types/globals.d.ts index 0dc41dbf..36425cf1 100644 --- a/resources/js/types/globals.d.ts +++ b/resources/js/types/globals.d.ts @@ -22,6 +22,5 @@ declare module '@vue/runtime-core' { $inertia: typeof Router; $page: Page; $headManager: ReturnType; - route: AppRouter; } } From 9c28ec1288eb7f97ad37c5edfc270dfbdb1f8b13 Mon Sep 17 00:00:00 2001 From: Tim Kunze Date: Sun, 8 Jun 2025 12:37:23 +0200 Subject: [PATCH 7/7] feat: Add useRoute composable --- resources/js/composables/useRoute.ts | 14 ++++++++++++++ 1 file changed, 14 insertions(+) create mode 100644 resources/js/composables/useRoute.ts diff --git a/resources/js/composables/useRoute.ts b/resources/js/composables/useRoute.ts new file mode 100644 index 00000000..4acfeab2 --- /dev/null +++ b/resources/js/composables/useRoute.ts @@ -0,0 +1,14 @@ +import {route} from 'ziggy-js'; +import { inject } from 'vue'; + +type Router = typeof route; + +export function useRoute(): Router { + const route = inject('route'); + + if (!route) { + throw new Error('Route is not provided. Make sure that you are using the ZiggyVue plugin correctly.'); + } + + return route; +}