If you're using React or another front-end javascript library in your Rails project, you're likely using Webpacker, but hot reload may not always work as expected or sometimes not at all with it's default configuration, so here is some step-by-step configuration:
config/webpack/development.js look like this:process.env.NODE_ENV = process.env.NODE_ENV || "development";
const environment = require("./environment");
// hot reloads of .html.erb and .css of non webpack stuff
const chokidar = require("chokidar");
environment.config.devServer.before = (app, server) => {
chokidar
.watch([
"config/locales/*.yml",
"app/views/**/*.html.erb",
"app/assets/**/*.css",
])
.on("change", () => server.sockWrite(server.sockets, "content-changed"));
};
module.exports = environment.toWebpackConfig();<%= javascript_pack_tag 'application' %> in any layouts that you want livereload to work