Stuck with Inertia Vue3 at app.js

[yamakrane]

Hi there,

Very sorry but i'm really stuck at this app.js as this is a new project and this what the app.js file looks like:

` require('./bootstrap');

import { createApp, h } from 'vue'; import { createInertiaApp } from '@inertiajs/inertia-vue3'; import { InertiaProgress } from '@inertiajs/progress';

const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';

createInertiaApp({ title: (title) => ${title} - ${appName}, resolve: (name) => require(./Pages/${name}.vue), setup({ el, app, props, plugin }) { return createApp({ render: () => h(app, props) }) .use(plugin) .mixin({ methods: { route } }) .mount(el); }, });

InertiaProgress.init({ color: '#4B5563' }); `

I don't really know how it should become as I tried many ways to make it work. Just throws errors again and again.

Thanks.

[rawalprashant]

I am working with the same structure, new laravel project with Vue 3, did you find any solution to make it work?

[publica10]

@yamakrane @rawalprashant

Just add the import statement to the other imports, and add .use(laravelPermissionToVuejs) after the .use(plugin) but before .mixin

I just did this on our Inertia / Vue3 / Laravel stack and it worked smooth as butter :)

[Amir-16]

stuck in app.js (import { createApp } from 'vue') with this ....

[nathanraposo]

Alguma solução para isto? mesmo problema aqui...

[MichInf]

No one find a solution?

[ahmedsaoud31]

npm update laravel-permission-to-vuejs

after that use

import { createApp, h } from 'vue'
import { createInertiaApp } from '@inertiajs/inertia-vue3'
import LaravelPermissionToVueJS from 'laravel-permission-to-vuejs'

createInertiaApp({
  resolve: name => require(`./Pages/${name}`),
  setup({ el, App, props, plugin }) {
    createApp({ render: () => h(App, props) })
      .use(plugin)
      .use(LaravelPermissionToVueJS)
      .mount(el)
  },
})