Bump. Since this last post, vitejs has emerged as the frontrunner of the next gen bundler. It’s become less Vue-centric (it was originally developed by the creator of Vue) and basically taken over this space. It now also has a gem that seems like a pretty thin wrapper, in a good way. Works very well in my simple, javascript sprinkles application.
But more importantly, it’s a natural fit for Rails.
Feature highlights:
- unbundled development! Webpack bundles for every change on development, meaning that hot module reload is almost worthless because it’s so slow. Vite outputs the untranspiled esm code because it takes as a given that you’re not developing on Ie11. There’s also stimulus helpers for both loading and hmr.
- a default production bundle setup (uses Rollup under the hood) that outputs css (with sass and/or postcss it you want), and modern javascript for modern browsers.
- a “legacy js” plugin that serves a second bundle, the standard polyfilled babel stuff that webpacker does by default. Uses nomodule attribute to avoid being loaded by modern browsers.
This is what convention over configuration for the frontend looks like. Someone with knowledge of frontend issues decided on a best practice for us so we don’t have to research everything ourselves. (You can override them, but the opinionated defaults work for 99% of websites.) I know more about how webpack works than I know about Active Record. This is because AR works well and webpack doesn’t. Webpack basically forced me to become a sysadmin of my frontend, and I’m really looking forward to stop caring about this stuff.
Also, vite is now default with Vue and SvelteKit, so a community is guaranteed.
I think the best course of action for Rails would be adopting it for, say, 7.1, and leave webpack behind forever.
