Laravel com HotReload

Vamos acelerar nosso desenvolvimento acrescentando um hotreload no nosso laravel?

O hotreload é gerenciado pelo NPM, então, tenha certeza de tê-lo instalado em seu computador. E óbvio, estamos falando de Laravel, então, tenha-o instalado e inicie o servidor do projeto.

Após ter iniciado o servidor do seu projeto com o comando:

php artisan serve

Aparecerá a seguinte mensagem no terminal:

Starting Laravel development server: http://127.0.0.1:8000

Após levantar o servidor, procure o arquivo webpack.mix.js na raíz do projeto. É nele que vamos incluir o comando no final do arquivo:

mix.browserSync('127.0.0.1:8000');

Pode também concatenar o comando ao mix, ficando assim:

mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [])
.browserSync('127.0.0.1:8000');

Um último detalhe para funcionar, é preciso adicionar algumas dependências de desenvolvimento. No caso, eu adicionei com Yarn

yarn add browser-sync browser-sync-webpack-plugin@2.0.1 -D

Pronto. Tudo pronto para ter nosso HotReload funcionando com Laravel.
Basta executar:

yarn watch
// ou
npm run watch

Tenha a certeza de ter executado o php artisan serve antes de rodar o yarn watch.

Arquiteto e Urbanista de formação, e Programador Web por paixão. Stack: PHP + MySQL e atualmente estudando Node React/Vue

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store