Open mechawrench opened 1 year ago
:information_source: Previously, Laravel configured several npm scripts for building assets. For Vite, Laravel configures a dev
script for generating and watching your assets (for development) and build
script for generating your assets (for production).
Shift attempted to replace commands using these scripts with their new Vite script. However, you may still be referencing these scripts in your code or in deployment scripts.
:informationsource: Laravel renamed the environment variables used by Mix to use a `VITEprefix, instead of
MIX_`. While Shift automated this change throughout your code, you should check for any additional references which may not be included in your Git repository.
:information_source: Vite requires JavaScript files containing JSX to have a .jsx
file extension. Shift did not detect any JSX in files with a .js
extension under the resources
folder. However, if you are using JSX, be sure the files have a .jsx
extension.
:information_source: The new @vite
Blade directive outputs <script>
tags with the type="module"
attribute. This attribute implicitly defers the script. This is a difference from Laravel Mix which may change the execution order of the JavaScript on your page.
If you experience JavaScript errors relating to undefined references, you may need to reorder your scripts or add the defer
attribute to any inline <script>
blocks on your page.
:alembic: This Shift is still being refined. Please report any issues or suggestions to shift@laravelshift.com. Your feedback is what helps improve the experience for everyone.
Upgraded Laravel Vite Plugin
The "laravel-vite-plugin" used in our project has been updated from version 0.2.1
to the latest 0.6.0
. This enhances our project with the latest features and improvements made in the plugin.
Upgraded Vite Package
The "vite" package has also been upgraded from version 2.9.11
to 3.0.2
. Vite is an important tool for modern web development that provides faster and leaner development experience.
Updated Vite Configuration
The vite.config.js
file has been adapted to the latest upgrades. In this file, we tell Vite how to behave when serving and building our project. This was required to make sure the upgraded packages are implemented correctly.
Elimination of Webpack Mix Configuration
The webpack.mix.js
file has been eliminated. This means we've shifted away from using Webpack as our module bundler in favor of Vite. By doing so, we're looking to benefit from Vite's faster and more efficient bundling capabilities.
This pull request includes changes for migrating from Laravel Mix to Vite outlined in Migration Guide and automated by the Vite Converter.
Before merging, you need to:
shift-95982
branchcomposer update
npm install
Please send your feedback to shift@laravelshift.com or share the good vibes on Twitter.