How to Deploy CSS/JS Assets with Vite to Live Server in Laravel

To deploy assets with Vite to the live server, one of the ways is to build them locally and then push the built assets to the repository.

First, make sure that you have @vite Blade directive in your <head>...</head> of the layout, like this:

1@vite(['resources/css/app.css', 'resources/js/app.js'])

Then, locally, you need to run this:

1npm run build

It will build the assets into the public/assets/build folder, with filenames like app.9c74dca2.css or app.a6b31529.js.

Then, change the default .gitignore that comes with Laravel:

Then, push all the code to production, and you don't need to re-build anything on the server, just do git pull from there.

Alternatively, you can make the front-end build a part of your deployment on the server side, including it in your Continuous Deployment scripts.

Like our articles?