Getting Started

If you are interested to learn more about Vite Ruby before trying it, check out the Introduction.

If you are looking for configuration options, check out the configuration reference.

Installation 💿

Add this line to your application's Gemfile:

gem 'vite_rails'

And then run:

bundle install

• If using Jekyll, install the jekyll-vite gem instead.

• If using Hanami, install the vite_hanami gem instead.

• If using Padrino, install the vite_padrino gem instead.

• If using other Ruby web frameworks, install the vite_ruby gem.

• If using Rails 4, install the vite_rails_legacy gem.

Setup 📦

Run bundle exec vite install, which:

• Adds the bin/vite executable to start the dev server and run other commands

• Installs vite and vite-plugin-ruby

• Adds vite.config.ts and config/vite.json configuration files

• Creates a sample application.js entrypoint in your web app

• Injects tag helpers in the default application.html.erb view layout

Tag Helpers

If you are using a different layout file, follow the Tag Helpers section to add them manually.

Running your first example 🏃‍♂️

Run bin/vite dev to start the Vite development server.

Restart your Rails or Rack web server before visiting any page, and you should see a printed console output:

Vite ⚡️ Ruby

You can now start writing modern JavaScript apps with Vite! 😃

Check an example app running on Heroku.

Not seeing anything?

Check the Troubleshooting section for common problems.

Further Configuration 🧩

Check the Recommended Plugins section for more information about plugins and useful libraries.

Official Vite.js Plugins

When using Vue, React, or Svelte, check out Vite's official plugins.

Contact ✉️

Please visit GitHub Issues to report bugs you find, and GitHub Discussions to make feature requests, or to get help.

Don't hesitate to ⭐️ star the project if you find it useful!

Using it in production? Always love to hear about it! 😃