Vite es ahora el paquete de activos de frontend por defecto para las aplicaciones de Laravel

El equipo de Laravel ha estado trabajando duro en la integración de Vite para Laravel. Desde algunas semanas, Vite es ahora el paquete de activos de frontend por defecto en los nuevos proyectos de Laravel, con actualizaciones también para Breeze y Jetstream:

Taylor Otwell compartió la forma más rápida de probar Vite en un nuevo proyecto si quieres obtener una demostración de lo rápido que Vite agrupa los activos:

laravel new breeze-test --git
cd breeze-test
composer require laravel/breeze
php artisan breeze:install vue
npm install
npm run dev

El uso de Laravel Breeze es la forma recomendada para comenzar con Vite, ya que proporciona el andamiaje de autenticación de frontend y backend y herramientas como Tailwind, Inertia y Vite.

La ejecución del código anterior debería terminar con Vite construyendo activos de desarrollo y esperando los cambios en el primer plano de su terminal:

El diseño principal de app.blade.php tendrá ahora una directiva @vite y mostrará el siguiente HTML durante el desarrollo:

<script type="module" src="http://127.0.0.1:3000/@vite/client"></script>
<script type="module" src="http://127.0.0.1:3000/resources/js/app.js"></script>

A medida que se realicen cambios en los archivos de Vue, se verá una salida similar a la siguiente, indicando las construcciones actualizadas.

9:41:12 PM [vite] hmr update /resources/js/Pages/Auth/Login.vue
hmr update /resources/css/app.css (x4)

La salida de HMR es la "sustitución de módulos en caliente", que proporciona tiempos de construcción casi instantáneos durante el desarrollo. Estas actualizaciones fueron tan rápidas que no podía creerlo al principio, lo que te ayuda a entrar en un flujo productivo mientras haces cambios en el frontend. Verás que las actualizaciones se producen automáticamente en el navegador mientras trabajas, lo cual es una experiencia fantástica.

Junto con la actualización de Vite, los documentos de Laravel tienen una página de documentación de Frontend, que le da una visión completa de todas sus opciones de frontend con las aplicaciones de Laravel.

Hacer que Vite sea el predeterminado es un gran logro y un paso para hacer avanzar a Laravel. ¡Enhorabuena a todos los implicados!

Artículo traducido del blog de Laravel New