Laravel Vite in Vue2 Issue

Question

I have this vite.config.js in my root project

import { defineConfig } from 'vite'
import laravel from 'laravel-vite-plugin'
import vue from '@vitejs/plugin-vue2'
import path from 'path'
import glob from 'glob'

export default defineConfig({
    plugins: [
        vue({
            template: {
                transformAssetUrls: {
                    base: null,
                    includeAbsolute: false
                }
            }
        }),
        laravel({
            input: [
                'resources/js/container/user/detail.js'
            ],
            refresh: true
        })
    ],
    resolve: {
        alias: {
            vue: 'vue/dist/vue.esm.js',
        }
    }
})

The file resources/js/container/user/detail.js exists as when I npm run build, everything will build properly.

In my blade.php file, I have this line of code

@vite('resources/js/container/user/detail.js')

Which will generate in html <script type="module" src="http://127.0.0.1:5718/resources/js/container/user/detail.js"></script>

But in the console of the browser, I am getting this error

GET http://127.0.0.1:5718/resources/js/container/user/detail.js 
net::ERR_ABORTED 500 (Internal Server Error)

What am I missing here? Also, the build files are located at public/js/dist/assets.