Moving from Webpack to Vite

The error "RangeError: Maximum call stack size exceeded at Proxy.hasOwnProperty" typically occurs when there is a circular reference or infinite loop in your code. In this case, it seems to be related to the usage of the createInertiaApp function.

To overcome this error, you can try the following steps:

1. Make sure you have installed the necessary dependencies for Vite and Inertia.js. You can do this by running npm install vite @inertiajs/inertia @inertiajs/inertia-vue3 in your project directory.

2. Update your app.js file to use the createApp function from Vite instead of the createInertiaApp function. Here's an example of how you can modify your code:

import './bootstrap';
import '../css/app.css';

import store from './store/index'
import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/inertia-vue3';
import { resolvePageComponent } from 'laravel-vite-plugin/inertia-helpers';
import { ZiggyVue } from '../../vendor/tightenco/ziggy/dist/vue.m';
import moment from "moment";

const appName = import.meta.env.VITE_APP_NAME || 'Laravel';

createApp({
    render: () => h(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)
                .use(store)
                .use(moment)
                .mount(el);
        },
        progress: {
            color: '#4B5563',
        },
    })
}).mount('#app');

1. After making these changes, run npm run dev to start the development server and see if the error is resolved.

If you're still experiencing issues, it's possible that there might be other factors causing the error. In that case, it would be helpful to provide more information about your project setup and any additional error messages you're encountering.