hotwire-livereload
esbuild-rails
hotwire-livereload | esbuild-rails | |
---|---|---|
2 | 3 | |
416 | 174 | |
- | - | |
6.1 | 4.8 | |
7 days ago | 11 months ago | |
JavaScript | JavaScript | |
MIT License | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
hotwire-livereload
-
Rails 7 Live Reloading CSS
https://github.com/kirillplatonov/hotwire-livereload has been working great for me
- Hotwire::Livereload v0.1: Automatically reload Turbo when "view" files are modified
esbuild-rails
-
Is the default importmap method unrealistic in the most popular real world use cases?
Here's the setup I use for reloading with esbuild: https://github.com/excid3/esbuild-rails/blob/main/examples/esbuild.config.mjs
-
Configure Stimulus with esbuild and Babel — Rails & Javascript
// config/esbuild.mjs import path from 'path' import esbuild from 'esbuild' import rails from 'esbuild-rails' import babel from 'esbuild-plugin-babel' esbuild .build({ bundle: true, // Path to application.js folder absWorkingDir: path.join(process.cwd(), 'app/javascript'), // Application.js file, used by Rails to bundle all JS Rails code entryPoints: ['application.js'], // Destination of JS bundle, points to the Rails JS Asset folder outdir: path.join(process.cwd(), 'app/assets/builds'), // Enables watch option. Will regenerate JS bundle if files are changed watch: process.argv.includes('--watch'), // Split option is disabled, only needed when using multiple input files // More information: https://esbuild.github.io/api/#splitting (change it if using multiple inputs) splitting: false, chunkNames: 'chunks/[name]-[hash]', // Remove unused JS methods treeShaking: true, // Adds mapping information so web browser console can map bundle errors to the corresponding // code line and column in the real code // More information: https://esbuild.github.io/api/#sourcemap sourcemap: process.argv.includes('--development'), // Compresses bundle // More information: https://esbuild.github.io/api/#minify minify: process.argv.includes('--production'), // Removes all console lines from bundle // More information: https://esbuild.github.io/api/#drop drop: process.argv.includes('--production') ? ['console'] : [], // Build command log output: https://esbuild.github.io/api/#log-level logLevel: 'info', // Set of ESLint plugins plugins: [ // Plugin to easily import Rails JS files, such as Stimulus controllers and channels // https://github.com/excid3/esbuild-rails rails(), // Configures bundle with Babel. Babel configuration defined in babel.config.js // Babel translates JS code to make it compatible with older JS versions. // https://github.com/nativew/esbuild-plugin-babel babel() ] }) .catch(() => process.exit(1))
-
Live reloading with Ruby on Rails and esbuild
Finally, if you're using esbuild with Rails and Stimulus, you'll probably find the esbuild-rails plugin from Chris Oliver useful.
What are some alternatives?
react-rails - Integrate React.js with Rails views and controllers, the asset pipeline, or webpacker.
importmap-rails - Use ESM with importmap to manage modern JavaScript in Rails without transpiling or bundling.
electronmon - 🖥 run, watch, and restart electron apps using magic
vite_ruby - ⚡️ Vite.js in Ruby, bringing joy to your JavaScript experience
stimulus_reflex - Build reactive applications with the Rails tooling you already know and love.
esbuild-plugin-alias - esbuild plugin for path aliases
octicons - A scalable set of icons handcrafted with <3 by GitHub
Foreman - Manage Procfile-based applications
vite-plugin-full-reload - ♻️ Automatically reload the page when files are modified
Webpacker - Use Webpack to manage app-like JavaScript modules in Rails
Hyperstack - Hyperstack ALPHA https://hyperstack.org
jsbundling-rails - Bundle and transpile JavaScript in Rails with esbuild, rollup.js, or Webpack.