Laravel: Menjalankan Livewire Tanpa php artisan serve - Irman Firmansyah

Cara membuat Laravel Livewire 3 berjalan dengan normal tanpa perintah php artisan serve

Masalah

Aplikasi Laravel yang menggunakan Livewire 3 bisa berjalan dengan normal jika menggunakan perintah php artisan serve

Tapi jika dijalankan di XAMPP misalnya dan diakses dengan URL localhost/nama_project/public Livewire nya tidak jalan

Hal ini terjadi karena Livewire load asset nya langsung dari root project /livewire/livewire.js dan karena URL nya ada tambahan /public maka asset nya tidak ditemukan

Solusi

Dari dokumentasinya sudah dijelaskan juga

app/Providers/AppServiceProvider.php

use Livewire\Livewire;
use Illuminate\Support\Facades\Route;

// ...

public function boot(): void
{
    Livewire::setScriptRoute(function ($handle) {
        return Route::get('/nama_project/public/livewire/livewire.js', $handle);
    });

    Livewire::setUpdateRoute(function ($handle) {
        return Route::post('/nama_project/public/livewire/update', $handle);
    });
}

• nama_project merupakan folder yang digunakan di htdocs XAMPP nya

Cara ini bisa digunakan juga agar aplikasi Laravel yang menggunakan Livewire 3 bisa jalan di XAMPP seperti aplikasi PHP lainnya (simpan folder Laravel di htdocs dan dijalankan dengan mengakses localhost/nama_project/public) atau di shared hosting dengan resource terbatas

Agar lebih dinamis bisa juga menggunakan kode berikut ini

public function boot(): void
{
    $appUrl = config('app.url');

    // Periksa apakah URL mengandung '/public'
    if (strpos($appUrl, '/public') !== false) {
        $appPath = parse_url($appUrl, PHP_URL_PATH) ?? '';

        Livewire::setScriptRoute(function ($handle) use ($appPath) {
            return Route::get("$appPath/livewire/livewire.js", $handle);
        });

        Livewire::setUpdateRoute(function ($handle) use ($appPath) {
            return Route::post("$appPath/livewire/update", $handle);
        });
    }
}

• $appPath akan menghasilkan path dari URL misal /nama_project/public

Karena mengambil value dari config app.url, maka harus di set bagian APP_URL di file .env

APP_URL=https://localhost/nama_project/public