carlos
carlos

Reputation: 160

Ziggy route is not found only in script

I have a problem with Ziggy using Inertia, Laravel and VueJS.

I did the next configuration:

Vite config:

 alias: {
            'ziggy-js': path.resolve('vendor/tightenco/ziggy'),
        },

I used the generator:

php artisan ziggy:generate

Then in app.js

import { ZiggyVue } from 'ziggy-js';
import { Ziggy } from '@/ziggy.js';

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => resolvePageComponent(`./Pages/${name}.vue`, import.meta.glob('./Pages/**/*.vue')),
    setup({ el, App, props, plugin }) {
        return createApp({ render: () => h(App, props) })
            .use(plugin)
            .use(ZiggyVue, Ziggy)
            .mount(el);
    },
    progress: {
        color: '#4B5563',
    },
});

It work perfect in <template></template>, but if I try in <script setup> i got ReferenceError: route is not defined

What i'm missing or doing wrong?

thanks

Upvotes: 0

Views: 178

Answers (1)

Amade
Amade

Reputation: 3998

If you want to use Ziggy's route function in <script setup> part of the component, you need to "inject" it first, as in:

<script setup>
import { inject } from "vue";

const route = inject("route");

// ...
</script>

Source:

Upvotes: 0

Related Questions