saakiiib/laravel-spa
最新稳定版本:v1.2.7
Composer 安装命令:
composer require saakiiib/laravel-spa
包简介
Zero-reload SPA engine for Laravel Blade — no jQuery, no Livewire, no Inertia.
README 文档
README
By default, every link click in Laravel loads a full new page — HTML, CSS, JS, fonts, everything re-downloads. SPA navigation skips that. Only the content changes, the rest stays. Faster, smoother, no white flash between pages.
Most Laravel SPA solutions force you to either abandon Blade entirely (Inertia) or add jQuery (pjax). This package adds that same speed on top of your existing Blade views — no rewrite, nothing changes except how fast it feels.
Quick Start
composer require saakiiib/laravel-spa php artisan vendor:publish --tag=spa-assets
Add
/public/vendorto your.gitignoreto avoid committing published assets.
Setup — @extends / @section
1. Layout file
Add @spaContent to your content wrapper and @spaEngine before </body>. Make sure @yield('script') comes after @spaEngine.
<main @spaContent> @yield('content') </main> @spaEngine @yield('script')
2. Navigation links
Add @spa to links you want SPA navigation on. Links without @spa do a normal full reload.
<a href="{{ route('home') }}" @spa>Home</a> <a href="{{ route('about') }}" @spa>About</a> <a href="{{ route('logout') }}">Logout</a>
3. Controller
public function home() { return spa('pages.home'); } public function about() { return spa('pages.about', compact('data')); }
4. Page views — no changes needed
@extends('layouts.app') @section('title', 'Home') @section('style') <style> .hero { background: #1a3c6e; color: #fff; padding: 60px; } </style> @endsection @section('content') <div class="hero"> <h1>Welcome</h1> </div> @endsection @section('script') <script> console.log('page loaded'); </script> @endsection
Setup — x-layout components
1. Layout component
Add @spaContent to your content wrapper and @spaEngine before </body>.
<head> <style> /* global styles */ </style> {{ $style ?? '' }} </head> <body> <main @spaContent> {{ $slot }} </main> <script> /* global scripts */ </script> @spaEngine {{ $script ?? '' }} </body>
2. Navigation links — same as above, add @spa:
<a href="{{ route('home') }}" @spa>Home</a> <a href="{{ route('logout') }}">Logout</a>
3. Controller — same as above:
public function home() { return spa('pages.home'); }
4. Page views
<x-app-layout title="Home"> <x-slot:style> <style> .hero { background: #1a3c6e; color: #fff; padding: 60px; } </style> </x-slot:style> <div class="hero"> <h1>Welcome</h1> </div> <x-slot:script> <script> console.log('page loaded'); </script> </x-slot:script> </x-app-layout>
What works out of the box
- URL updates, back/forward button, refresh, direct links — all work
- Per-page styles and scripts load and unload on every navigation
- Session expiry redirects cleanly instead of breaking
- Hover prefetch — pages start loading before you even click
- Works with both
@extendsandx-layout
Requirements
- PHP 8.1+
- Laravel 10, 11, or 12
Contributing
Found a bug or want to improve something? PRs are welcome on GitHub.
License
MIT — Sakib
统计信息
- 总下载量: 39
- 月度下载量: 0
- 日度下载量: 0
- 收藏数: 28
- 点击次数: 1
- 依赖项目数: 0
- 推荐数: 0
其他信息
- 授权协议: MIT
- 更新时间: 2026-05-20