Methods property "route" is already defined in Props.

[JshGrn]

Ziggy version

1.6

Laravel version

10

Description

In a new Vue 3 product, when I add app.use(Ziggy) I get this warning in console:

Methods property "route" is already defined in Props.

This is without using route() function within the app, although it does work.

Ziggy call and context

import { ZiggyVue } from 'ziggy';
const app = createApp(App)

app.use(createPinia())
app.use(router)
app.use(ZiggyVue, {})
app.mount('#app')

This is a fresh Vue 3 project with Ziggy the only additionally installed composer package

Ziggy configuration

N/A

Route definition

N/A

[bakerkretzmar]

app.use(ZiggyVue, {}) overrides Ziggy's config with an empty object. Change it to app.use(ZiggyVue).

[JshGrn]

Sorry that was left over from testing, as you describe I get the warning, empty config actually stops it working which I realised after posting but didn't edit

Message ID: @.***>

[JshGrn]

@bakerkretzmar, could you assist in what I am doing wrong? A fresh Vue 3 project with Laravel using Vue-Router and Ziggy provides this warning. Is there a way I can rename the routes() function to something else?

main.js:31 [Vue warn]: Methods property "route" is already defined in Props. 
  at <RouterView> 
  at <Default> 
  at <App>

[bakerkretzmar]

Is there a way I can rename the routes() function to something else?

Yes, don't use Ziggy's provided Vue plugin and register your own mixin or globally provided helper, e.g.:

import route from 'ziggy-js';

createApp()
  .mixin({
    methods: {
      customRouteHelper: route,
    },
  });

[JshGrn]

Ok, so this is just a conflict between Vue-Router I presume, maybe it should be put in the docs?

[nshiell]

I have this issue too, I've read through this bug, but I'm not able to fix it Is there any advice I can follow?