📡 You're offline — showing cached content
New version available!
Quick Access
Tutorials Laravel Framework Vite and Frontend

Vite and Frontend

5 min read
Bundle frontend assets with Vite, use HMR in development, and compile for production.

Vite Asset Bundling

// Install
npm install
npm run dev    // development with HMR
npm run build  // production build

// vite.config.js
import { defineConfig } from "vite";
import laravel from "laravel-vite-plugin";
export default defineConfig({
    plugins: [laravel({ input: ["resources/css/app.css","resources/js/app.js"] })],
});

// Blade — include compiled assets
@vite(["resources/css/app.css", "resources/js/app.js"])

// With React/Vue
composer require laravel/breeze --dev
php artisan breeze:install react   // or vue

// Inertia.js — SPA feel without separate API
// Render Vue/React from Laravel controllers
return Inertia::render("Posts/Index", ["posts" => PostResource::collection($posts)]);