Source: christoph-rumpel.com

Moving A Laravel Webpack Project To Vite
Vite is the new front-end tooling for Laravel. https://vitejs.dev/ is the Next Generation Frontend Tooling, which is Laravel's default from now on.

Make sure to have the latest version of Laravel, which today is 9.19, to use the new Vite tooling.

import laravel from 'laravel-vite-plugin' import {defineConfig} from 'vite' export default defineConfig({ plugins: [ laravel([ 'resources/css/app.css', 'resources/js/app.js', ]), ], }); This is where we use the vite and laravel-vite-plugin packages, and we also define our asset paths.

To run Vite, you use the npm script npm run dev, which we have defined, which is just an alias for npm run vite.
Newsletter

Get the latest Laravel/PHP jobs, events and curated articles straight to your inbox, once a week

Fathom Analytics | Fast, simple and privacy-focused website analytics. Fathom Analytics | Fast, simple and privacy-focused website analytics.
Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future. Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future.
Community Partners