Shift with red gradient lettering

Upgrade from Laravel Mix to Vite

The Vite Converter automates the upgrade of your Laravel application from using Laravel Mix to Vite. Laravel adopted Vite as its frontend build tool in Laravel 9 as a modern, faster alternative to Laravel Mix.

Using the Vite Converter to automatically upgrade your Laravel application has an estimated time savings of 1 hour.

Screenshot of a pull request with automated changes from the Vite Converter

Requirements

  • A Laravel application running Laravel 9.x or higher.
  • Running Laravel Mix.

Automated Conversions

The Vite Converter automates many of the upgrades listed in the Vite Upgrade Guide, including:

  • Adding npm dependencies.
  • Updating your npm scripts to use Vite.
  • Configuring Vite for your project.
  • Removing webpack.mix.js.
  • Renaming MIX_* environment variables.
  • Converting JavaScript require statements to import.
  • Adding PostCSS configuration for Tailwind.
  • Converting to the new @vite Blade directive.
  • Converting Laravel Mix test helpers.

Manual Conversions

Vite has stricter code requirements than Laravel Mix. As such, if your project is using a JavaScript framework like Vue, React, or Inertia, you may need to perform some additional manual steps, such as updating file extensions. Shift will attempt to leave a detail comment outlining these additional steps in the PR.

If you have a complex or heavily-customized build process with Laravel Mix you may need to rework some processes for Vite. It is possible Vite may not have a comparable process. If not, you may continue to use Laravel Mix.