Skip to content

Conversation

@lukas-staab
Copy link
Member

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:

  • Checkout the shift-153394 branch
  • Run composer update
  • Run npm install
  • Review all comments for additional changes
  • Thoroughly test your application (no tests?, no CI?)

Please send your feedback to shift@laravelshift.com or share the good vibes on Twitter.

@lukas-staab
Copy link
Member Author

ℹ️ 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.

@lukas-staab
Copy link
Member Author

ℹ️ Laravel renamed the environment variables used by Mix to use a VITE_ prefix, 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.

@lukas-staab
Copy link
Member Author

ℹ️ 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.

@lukas-staab
Copy link
Member Author

⚠️ Vite generates frontend assets to the public/build folder. This folder is not tracked by Git within a default Laravel project. As such, Shift added this folder to your .gitignore file.

If you wish to track the generated frontend assets within your project, such as for ease of deployment, you may undo this commit by running: git revert a0730626

@lukas-staab
Copy link
Member Author

⚠️ Shift detected you may be using the tilde (~) prefix to import CSS or JavaScript. You may try to add an alias for the ~ to your Vite configuration. Alternatively, you may update these imports to use an absolute reference or @ alias.

@lukas-staab
Copy link
Member Author

ℹ️ 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.

@lukas-staab
Copy link
Member Author

⚗️ 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.

@lukas-staab
Copy link
Member Author

War free, muss nicht sofort sein - kann man auch mit dem laravel update zusammen machen. Kannst es schließen wenn du es gerade nicht hilfreich findest @schlagma

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants