Sentry Answers>Laravel>

How do I fix the Laravel error: Vite manifest not found?

How do I fix the Laravel error: Vite manifest not found?

Richard C.

The ProblemJump To Solution

Vite.js is a front-end web application bundler for HTML, JavaScript, and CSS. In 2024, it is the default bundler for Laravel.

When you run npm run build in your Laravel project, the script in package.json calls vite build, which generates the file public/build/manifest.json. If this manifest file is missing, you will get the error Vite manifest not found when trying to run your Laravel application.

The Solution

There are a few causes for this error. Let’s look at each.

npm Packages Not Installed

First, check that your package.json file contains the scripts:

Click to Copy
"scripts": { "dev": "vite", "build": "vite build" }

It must also contain the dependency requirements for Vite:

Click to Copy
"devDependencies": { "laravel-vite-plugin": "^1.0.0", "vite": "^5.0.0"

The above sections are included automatically in modern Laravel. If your package.json doesn’t have them, you need to add them.

Now install the dependencies and build your project:

Click to Copy
rm -rf node_modules npm install npm run build

These commands will create public/build/manifest.json.

Since the /public/build folder is excluded from Git by the .gitignore file, you need to run npm install and npm run build on every computer where you run your Laravel app. This includes your public web server if you are using Git to deploy the project.

Old Versions of Laravel and Node

If the npm commands in the previous section fail, and your project is very old, you may need to upgrade Laravel, Node.js, and npm to the latest version. This might differ depending on how you installed these tools, but in general, you can run the commands below to upgrade and refresh Laravel:

Click to Copy
composer clear-cache composer update --with-all-dependencies php artisan optimize:clear php artisan optimize php artisan migrate

You can find the latest version of Laravel here.

To update Node and npm you should install the Node Version Manager:

Click to Copy
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash

Then in a new terminal (the old terminal won’t see nvm yet) install the latest version of Node and npm:

Click to Copy
nvm install node nvm use node npm install -g npm@latest

cPanel Web Host Directory Structure Problems

Your Laravel project might run correctly on your local machine or a Docker container, but fail on a shared PHP web host where you don’t have full control of PHP.

First, check that your web host has a recent version of PHP and Node. If your user interface is cPanel, you can browse to Software or similar, depending on your theme and version of cPanel, to find this information. If a version selector is available, choose the latest version.

Next, check that when you uploaded all your files to the server via FTP, you included the entire public/build folder and the manifest file.

Finally, you need to check the folder structure of where you uploaded your code on the host. Be aware that files uploaded to the public_html folder on a web host are available to anyone on the internet to browse. You most likely want only your client-side code there, such as HTML, JS, CSS, and images. Your back-end code should be private, as it may contain business logic and secrets. There are two ways to achieve privacy when using the public_html folder:

  • You can upload your entire app to the public_html folder, and alter the .htaccess file to redirect all HTTP requests to a public subfolder. If you do this, you need to test carefully that the rule works to avoid publicly exposing information.
  • You can also upload your public subfolder to the public_html folder on the host, and upload the rest of your code to another folder so that it is not publicly browsable.

In both cases, you need to have a copy of your index.php file in the public_html folder or visitors will not be able to browse to your app. You need to edit index.php to change all file paths, such as '/../vendor/autoload.php', to the correct folders on your host, or Laravel will not know where to resolve dependencies.

Deploying a Laravel app to shared hosting can be tricky, and we recommend rather using a small Docker-based cloud host if you are looking for a cheap solution. That way you still have complete control over the files and frameworks that the container is running, rather than relying on a shared configuration.

  • SentryHow Sentry Can Improve Your Laravel Application
  • SentryLaravel Error and Performance Monitoring
  • Syntax.fm logo
    Listen to the Syntax Podcast

    Tasty treats for web developers brought to you by Sentry. Get tips and tricks from Wes Bos and Scott Tolinski.

    SEE EPISODES

Loved by over 4 million developers and more than 100,000 organizations worldwide, Sentry provides code-level observability to many of the world’s best-known companies like Disney, Peloton, Cloudflare, Eventbrite, Slack, Supercell, and Rockstar Games. Each month we process billions of exceptions from the most popular products on the internet.

© 2024 • Sentry is a registered Trademark
of Functional Software, Inc.