Unable to vite build for production in Laravel

Question

I have a Laravel + Livewire app, that I'm trying to build for production.

I can successfully run ./vendor/bin/sail npm run build:

./vendor/bin/sail npm run build

> build
> vite build

vite v3.2.7 building for production...
transforming (19) node_modules/axios/lib/helpers/buildURL.js
🌼 daisyUI components 2.52.0  https://daisyui.com
  ✔︎ Including:  base, components, 2 themes, utilities
  ❤︎ Support daisyUI:  https://opencollective.com/daisyui 
  
✓ 60 modules transformed.
public/build/manifest.json             0.25 KiB
public/build/assets/app.bf5ec64f.css   80.27 KiB / gzip: 12.73 KiB
public/build/assets/app.8c40d1a4.js    143.69 KiB / gzip: 51.52 KiB

The assets are loaded in a blade layout using the @vite directive:

...
{{-- Scripts --}}
@vite(['resources/css/app.css', 'resources/js/app.js'])
...

However when I view the page source, I can see it still references port 5173 (which would be the vite dev server):

<script type="module" src="http://localhost:5173/@vite/client"></script><link rel="stylesheet" href="http://localhost:5173/resources/css/app.css" /><script type="module" src="http://localhost:5173/resources/js/app.js"></script>

I was expecting to see a reference to public/build/assets/...

My vite.config.js is fairly simple:

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: [
                'resources/css/app.css',
                'resources/js/app.js',
            ],
            refresh: true,
        }),
    ],
    server: {
        hmr: {
            host: 'localhost',
        },
    }
});

The documents (https://laravel.com/docs/10.x/vite#loading-your-scripts-and-styles) says that:

"In build mode, the directive will load your compiled and versioned assets, including any imported CSS."

...but it does not appear to be doing that.

How do I stop the @vite directive / vite from trying to use the vite dev server, and use the compiled assets? (As obviously, the vite server won't be running in prod).

I've tried APP_DEBUG=false and APP_ENV=prod in my .env, and ./vendor/bin/sail artisan view:clear which makes no difference.

Deps are up to date: "laravel/framework": "^10.0", and "vite": "^3.2.7" (currently 4.4.2).

Answer 1

Turns out that if the 'hotfile' exists in ./public/hot then the vite blade directive (see: vendor/laravel/framework/src/Illuminate/Foundation/Vite.php) will try to look for the vite server and perform hot reloading.

Simply remove ./public/hot and it all works fine!