You search for “Laravel Vue” and land on three different architectures. They are not interchangeable. Pick one before you install packages, because Vue Router next to Inertia, or Sanctum tokens inside a starter kit, creates work you have to undo.
TL;DR
- Default: Inertia + the Vue starter kit. One team, a logged-in app, no public API yet. Routes stay in Laravel.
- Vue SPA + Sanctum when the browser is one of several API clients. Auth is a session cookie, not a token.
- Nuxt 4 when the public site is the product; Livewire when the team writes PHP, not Vue.
- Can’t name a second API client this quarter? Use the starter kit.
The versions below are the ones we would start with in October 2026. The checklist is in what you need.
Option 1: Inertia and the Vue starter kit#
This is the default. laravel new with the Vue starter kit gives you Laravel 13, Inertia 3, Vue 3.5, TypeScript, Vite 8, Tailwind CSS 4, and shadcn-vue. Login already works. Routes stay in routes/web.php. A controller returns Inertia::render() and the Vue page receives props. There is no API to design for the screens you render yourself.
Start one
laravel new blogPick the Vue starter kit when the installer asks. The setup guide walks through every prompt.
Use this when one team owns the product, the UI is a logged-in application, and you do not need a public API on day one. The setup guide gets the first page on screen. The CRUD guide adds create, edit, delete, search, and pagination.
Gotcha: no Vue Router here
Do not add Vue Router for those pages. Inertia already navigates. A second router fights it.
Client-only state, such as a draft that should survive a visit to another page, belongs in Pinia. Server state stays in the props.
Option 2: a Vue SPA with Sanctum#
Use a separate Vue app when the browser is one of several clients. A mobile app, a partner, or a second front end needs an HTTP API. Laravel owns JSON. Vue owns the URL, with Vue Router.
Authentication for that first-party SPA is a session cookie, not a bearer token. Sanctum’s own docs say not to use API tokens for your own SPA. The cookie flow, the CSRF call, and the CORS settings are in Authenticate a Vue SPA with Laravel Sanctum.
Heads up: the cost of the split
This split costs more at the start. You design resources, pagination, and errors twice, once in JSON and once in the client. You also deploy two things, or you proxy the SPA through Laravel. Take that cost when the API is the product.
Option 3: Nuxt in front of Laravel#
Nuxt 4 is the right Vue front end when the public site is the product: marketing pages, a content site, or a storefront that must be fast and indexable without you running Inertia’s SSR process. Laravel stays the API and the admin. Nuxt talks to it over HTTP, usually with Sanctum cookies if the two apps share a parent domain.
Do not start here for an internal tool. You would rebuild routing, auth, and data loading that the Vue starter kit already ships.
Livewire, when the team is not a Vue team#
Laravel’s other official starter kit is Livewire. The UI is Blade, rendered on the server. Choose it when the people writing the screens are PHP developers and the interactions fit server-round-trips. Choose Vue when the screen is a dense client: a builder, a large table with local state, or a component library you already have in Vue.
Livewire is not a Vue setup. Do not install both to render the same page. The longer comparison is Livewire or Inertia.
What changes and what stays the same#
| Job | Inertia + Vue | Vue SPA or Nuxt |
|---|---|---|
| Routing | Laravel | Vue Router or Nuxt |
| Auth for the browser | Starter kit session | Sanctum cookie session |
| Auth for a phone app | Sanctum token, separate routes | Sanctum token |
| Page data | Inertia props | JSON |
| Files | Inertia form upload | multipart/form-data to the API |
| Live updates | Reverb and Echo | Same, with the SPA auth header |
| Production | Vite build and SSR | SPA host plus Laravel |
PHP is still 8.3 to 8.5. Node is 20.19+ or 22.12+, which includes 24 LTS. New apps still start on SQLite and move to MySQL, MariaDB, or PostgreSQL when production needs it.
A rule for the first week#
Pro tip: the one-question test
If you cannot name a second client that will call the API this quarter, use the Vue starter kit.
Ship the first CRUD. Add a JSON API later for the clients that actually exist. The package chart on /packages is the same list either way. The install recipe on /tools/recipe only helps after this choice, because it will not stop you installing Vue Router beside Inertia.
Recap#
- Inertia + the Vue starter kit is the default for one team building a logged-in app.
- A Vue SPA with Sanctum cookies is for when the API has several real clients.
- Nuxt 4 is for a public, indexable site; Livewire is for PHP-first teams.
- Never mix Vue Router with Inertia, or Livewire with Vue on the same page.
FAQ#
Should I use Inertia or a separate Vue SPA with Laravel?
Use Inertia with the Vue starter kit unless you already have a second client (mobile app, partner, another front end) that needs a JSON API this quarter.
Can I use Vue Router with Inertia?
No. Inertia already handles navigation with Laravel routes; a second router fights it. Vue Router belongs in a separate SPA.
Should a first-party Vue SPA use Sanctum tokens?
No. Sanctum’s docs recommend its cookie-based SPA authentication for your own SPA. Tokens are for mobile apps and third parties.
When is Nuxt better than Inertia for a Laravel app?
When the public site is the product and must be fast and indexable, such as marketing pages, content sites or storefronts. Laravel stays the API.
Which PHP and Node versions do I need in 2026?
Laravel 13 needs PHP 8.3 to 8.5. Vite 8 needs Node 20.19+ or 22.12+ (Node 24 LTS works).
Next steps#
Read down this list. Each link is a different job, and they link back here so the stack choice stays in one place.
Setup. What you need, then the first page. If a tutorial still says Breeze or Jetstream, read that map before you install either package.
The first feature. Create, edit, delete, and search, then a saved message, pagination, and a sortable table. Live validation and file uploads sit on that form.
Auth. Sanctum cookies, CORS errors, Fortify, and GitHub login. Sanctum or Passport is the OAuth decision. Vue Router is only for the separate SPA.
The rest of the app. Nuxt in front of the API and JSON resources. Permissions and policies. Pinia, partial reloads, and typed routes. Older tutorials still say Ziggy. TypeScript props, a document title, a persistent layout, and translations. Reverb, database notifications, and a queued job on the page.
Agents. Laravel Boost teaches the coding agent the Vue and Inertia versions you installed. The AI SDK answers a note on a Vue page. The provider key stays on the server.
Short searches. One hundred short guides answer one failure each: a 419, a validation error, a Fortify email, a queue worker, a session cookie.
Production. Sail, Vite, and tests. Then server rendering, deploy, and Livewire or Inertia.
