Laravel + Vite + SASS

Debemos tener instalado NodeJS, usamos el siguiente comando para saber si lo tenemos instalado. Si no nos muestra la versión de Node, es que no lo tenemos instalado. Entonces iríamos a la página de nodejs.org y instalamos la última versión LTS recomendada.

node -v

Instalamos las depencias, esto creará una carpeta llamada node_modules

npm install

Levantar el servidor en desarrollo

npm run dev

Para incluir archivos CSS

@vite(['resources/assets/css/app.scss'])

Para incluir imágenes

{{ Vite::asset('resources/assets/images/logo.svg') }}

Crear assets para el entorno de producción. Se creará la carpeta build en public con todos los archivos que tengamos en resources.

npm run build

* Si los enlaces en la vista siguen apuntando a la version de desarrollo, hay que comprobar que no exista un arxivo llamado hot en la carpeta public. Si está, hay que eliminarlo.

Node Includes

npm install jquery

npm install jquery-bridget

npm install sass

npm install bootstrap

npm install masonry-layout --save

Ejemplos de importación

Archivo app.js (carpeta resources)

import $ from 'jquery';
window.$ = $;
import jQueryBridget from 'jquery-bridget';
import * as bootstrap from 'bootstrap';
import Masonry from 'masonry-layout';
jQueryBridget( 'masonry', Masonry, $ );