Laravel 8中livewire.js连接报404错误，wire:model失效求助

Hey there, let’s get that Livewire issue sorted out—nothing’s more frustrating than wire:model not working because of a 404 on livewire.js. I’ve run into this exact snag before, so here are the most reliable fixes to try, in order of how often they solve the problem:

• Clear Route Cache First
  Livewire relies on dynamic routes to serve its JS and handle component requests, and Laravel’s route cache can completely break this. Run this command immediately:
  php artisan route:clear
  If you ever ran php artisan route:cache in the past, this is the #1 fix for missing Livewire assets.

• Verify Livewire Asset Setup
  Make sure you’re including the required Livewire tags in your master template:

  • Add @livewireStyles inside the <head> section of your layout
  • Add @livewireScripts right before the closing </body> tag
    If you still get a 404, publish Livewire’s static assets to your public directory to ensure they’re accessible:
    php artisan livewire:publish --assets

• Check Your APP_URL Configuration
  Head over to your .env file and confirm that APP_URL matches exactly the URL you’re using to access your app (e.g., http://localhost:8000 for local development). Livewire uses this to generate correct asset paths—if it’s mismatched, the JS file will point to a wrong URL.

• Clear All Caches
  Sometimes stale cache causes weird issues. Run these commands one after another:

  • php artisan view:clear
  • php artisan cache:clear
  • composer dump-autoload

• Verify Server Rewrite Rules
  If you’re using Apache, double-check that your .htaccess file in the public directory has the correct Laravel rewrite rules (it should redirect all requests to index.php). For Nginx, make sure your server block includes a location block that passes all requests to index.php—without this, Livewire’s internal routes won’t be processed correctly.

• Double-Check Component Naming & References
  Ensure your Livewire component class names and template references match. For example, if your component is App\Http\Livewire\UserProfile, you should reference it in your blade file as <livewire:user-profile> or @livewire('user-profile') (lowercase with hyphens). Mismatched names can lead to failed requests that manifest as JS 404s.

If none of these work, open your browser’s DevTools, go to the Network tab, and look at the exact URL that’s returning a 404. That will give you a clue—whether it’s an incorrect asset path, a missing route, or something else.

内容的提问来源于stack exchange，提问作者Tahmid