CODEWITHSUNDEEP
laravelvite
Luke Snowden
Luke Snowden

Reputation: 4196

Larave & Vite - Vite manifest missing odd files

enter image description here

In this image there are 5 separate images all in the same folder. When I run npm run build the manifest file is generated and two of the files are not entered (favicon-32x32|16x16).

The images are clearly present;

enter image description here

When this goes into production I get the following 500 error;

[2022-08-26 14:30:52] production.ERROR: Unable to locate file in Vite manifest: resources/images/favicon/favicon-32x32.png. {"view":{"view":"/home/forge/myproject/resources/views/app.blade.php","data":[]},"exception":"[object] (Spatie\\LaravelIgnition\\Exceptions\\ViewException(code: 0): Unable to locate file in Vite manifest: resources/images/favicon/favicon-32x32.png. at /home/forge/myproject/vendor/laravel/framework/src/Illuminate/Foundation/Vite.php:539)

Is there any reason why these files would not be added to the manifest?

Upvotes: 4

Views: 2976

Answers (1)

Jaap
Jaap

Reputation: 1179

Check the size of your assets. I ran into an issue a couple of days ago where images smaller then 4kb would be inlined trough base64.

As stated in the vite docs

Assets smaller in bytes than the assetsInlineLimit option will be inlined as base64 data URLs.

Setting

build: { assetsInlineLimit: 0 }

In vite.config.js would eliminate that behavior.

I posted a question about that asset inlinement. See How to make Laravel Vite copy static assets versioned to build folder

Furthermore Vite is not able to locate assets in Blade templates, so you need to tell Vite if you're using the Vite::asset() helper in your blade templates to account of these images. This is done by implementing a little javascript somewhere in your application. (The file should be processed by Vite of course)

import.meta.glob([
  '../images/**',
  '../fonts/**',
]);

See Laravel docs: https://laravel.com/docs/9.x/vite#blade-processing-static-assets

Last thing to check is to make sure you run npm run build on production, might clear your views as well while you're at it by doing a php artisan view:clear

By the way, at the time of writing I'm running into issues with assets used in Blade that fall below the mentioned base64 threshold. At that point they won't work. At the moment I'm setting the assetsInlineLimit to 0 to just skip the base64 inlining. However, I think it's a nice feature and this issue will probably be addressed somewhere in the near feature.

Upvotes: 8

Related Questions