Introduction
Vite Ruby is an umbrella project that provides full Vite.js integration in Ruby web apps.
vite_rails provides similar functionality as webpacker does for webpack, without all the configuration overhead and dependencies.
vite_ruby can be used in plain Rack apps, and is all you need when using HTML entrypoints.
There are also integrations for Jekyll, Hanami, and Padrino.
Read an introduction blog post.
Why Vite? 🤔
Vite does not bundle your code during development, which means the dev server is extremely fast to start, and your changes will be updated instantly.
In production, Vite bundles your code with tree-shaking, lazy-loading, and common chunk splitting out of the box, to achieve optimal loading performance.
It also provides great defaults, and is easier to configure than similar tools like webpack.
Check this video comparison with webpack which demonstrates the difference in boot time, or this one with the difference in speed during development.
Why Vite Ruby? 🤔
Vite is great on its own, but configuring it correctly to work for a Ruby app structure requires knowledge of its internals.
By following existing Rails and Rack conventions, and adding a few of its own, it becomes possible for everyone to leverage Vite and its wonderful features!
Interested in hearing more? Read an introduction blog post, learn how it works, or read about my personal motivation.
Features ⚡️
Everything Vite provides, plus:
🤖 Automatic entrypoint detection
Simply place your code under app/frontend/entrypoints, and the entrypoints will be configured automatically.
⚡️ Lightning-fast hot reload
Because it does not bundle your code in development, only the scripts and styles that are running need to be processed, which enables Vite to have significantly faster HMR than webpack.
🚀 Integrated with assets:precompile
Rake tasks for building and Vite assets are automatically integrated with assets:precompile, so deploying is straightforward.
🏗 Auto-build when not running Vite
When the development server is not running, it will automatically detect changes and recompile assets for you. Makes it seamless to run integration tests.
🏷 Smart tag helpers
Tag helpers for script and link tags are provided, and will automatically output preload tags in production to optimize load time.