Laravel 10+Livewire 3.4部署到XAMPP后组件失效求助

检查XAMPP虚拟主机配置 #

• 避免直接将Laravel项目放在htdocs根目录下通过子路径访问，Livewire对路由base URL敏感，子路径易导致组件请求路径错误。
  • 打开XAMPP的apache/conf/extra/httpd-vhosts.conf，添加虚拟主机配置：

    <VirtualHost *:80>
        DocumentRoot "C:/xampp/htdocs/你的项目名/public"
        ServerName your-project.test
    </VirtualHost>
    

  • 修改系统hosts文件，添加127.0.0.1 your-project.test，重启Apache服务。

确认Livewire的asset_url配置 #

• 确保config/livewire.php中的asset_url与项目访问根URL一致，示例：

  'asset_url' => 'http://your-project.test',
  

• 执行php artisan config:clear清除配置缓存，确保新配置生效。

验证项目.htaccess文件 #

• 确认public/.htaccess为Laravel默认配置，避免路由重写异常：

  <IfModule mod_rewrite.c>
      <IfModule mod_negotiation.c>
          Options -MultiViews -Indexes
      </IfModule>
  
      RewriteEngine On
  
      # Handle Authorization Header
      RewriteCond %{HTTP:Authorization} .
      RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]
  
      # Redirect Trailing Slashes If Not A Folder...
      RewriteCond %{REQUEST_FILENAME} !-d
      RewriteCond %{REQUEST_URI} (.+)/$
      RewriteRule ^ %1 [L,R=301]
  
      # Send Requests To Front Controller...
      RewriteCond %{REQUEST_FILENAME} !-d
      RewriteCond %{REQUEST_FILENAME} !-f
      RewriteRule ^ index.php [L]
  </IfModule>
  

• 检查XAMPP的Apache是否启用mod_rewrite模块，在httpd.conf中取消LoadModule rewrite_module modules/mod_rewrite.so的注释，重启Apache。

修正项目访问路径配置 #

• 如果必须通过localhost/你的项目名访问，在.env中设置APP_URL=http://localhost/你的项目名，同时同步更新config/livewire.php的asset_url为相同值，执行php artisan config:clear生效。

重新发布Livewire静态资源 #

• 执行php artisan livewire:publish --assets，确保XAMPP环境下的Livewire资源文件路径正确。

检查目录权限 #

• 确保Apache进程对项目的storage和bootstrap/cache目录有读写权限，权限不足可能导致Livewire无法生成临时文件或路由缓存。

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