rails webpacker live-reload views

rails webpacker live-reload views

webpacker дает возможность использовать webpack и webpack-dev-server вместе с Rails. webpacker отлично интегрирован с Rails и имеет все необходимые настройки для быстрого старта с основными популярными технологиями, такими как React или Vue.

При разработке мы можем использовать все преимущества webpack. При этом webpacker сосуществует совместно с assets pipeline, не отменять стандартной логики Rails. Основная цель webpacker предоставить возможность работы с javascript в логике js-приложений. Картинки, стили и отдельные скрипты могут продолжать находиться в app/assets/*.

Тем не менее можно полностью отказаться от классического конвейера  ресурсов Rais и полностью перенести все ресурсы, включая изображения, шрифты и стили в логику webpacker.

Как мы знаем webpack строит граф зависимостей от entrypoint и отслеживает изменения в файлах.

Как сделать чтобы при изменениях в app/views/**/*.html.{erb,slim} браузер также перезагружался. Будем отслеживать файлы и отправлять уведомления серверу через socket.

Добавим код в config/webpack/development.js

const chokidar = require('chokidar')
environment.config.devServer.before = (app, server) => {
  chokidar.watch([
    'config/locales/*.yml',
    'app/views/**/*.slim',
    'app/views/**/*.erb'  
  ]).on('chnage', () => server.sockWrite(server.sockets, 'content-changed'))
}