Laravel 10 &amp; Vite issue

Level 102

If you dont need lodash, simply remove it from C:/Lara Projects/base_auth/resources/js/bootstrap.js

Just delete that line and it should work :)

Level 3

@Sinnbeck So Something like this... uncommented the 1st 2 lines

//import _ from 'lodash';
//window._ = _;

import 'bootstrap';

/**
 * We'll load the axios HTTP library which allows us to easily issue requests
 * to our Laravel back-end. This library automatically handles sending the
 * CSRF token as a header based on the value of the "XSRF" token cookie.
 */

import axios from 'axios';
window.axios = axios;

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

Level 3

Thank you for your prompt reply.

so should I just revert back to MIX?

Level 102

@aifx4intel No need to? Vite is awesome and I would continue to use it if I were you. It just works a bit different. Instead of compiling files when running "dev" it just runs a dev server that pushes the asserts to the browser.

Is it stille not working or?

Level 3

@Sinnbeck let me do as you instructed and reply then...

Level 102

@aifx4intel The thing with vite is the speed. When using mix my app took 1-2 seconds to recompile on any change. With vite its instant and dont need to reload the page.

1 like

Level 3

ok - if Vite is the way forward how do i resolve this out of the box issue..

when i click 'register' on laravel auth welcome page i get this:

Vite manifest not found at: C:\Lara Projects\base_auth\public\build/manifest.json

What i the bet way to resolve this keeping vite?

Level 102

@aifx4intel That is for when you dont run the dev server. To make the file simple build for production with npm run build

Level 102

Be aware that with mix, it compiles files with the dev command. Vite does not.. So when you want to do development be sure to run npm run dev

Level 3

thanks. I hear you.... so how do i resolve this error to include Vite? I uncommented the lodash in resources/js/bootstrap.js

//import _ from 'lodash';
//window._ = _;

import 'bootstrap';

/**
 * We'll load the axios HTTP library which allows us to easily issue requests
 * to our Laravel back-end. This library automatically handles sending the
 * CSRF token as a header based on the value of the "XSRF" token cookie.
 */

import axios from 'axios';
window.axios = axios;

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

yet when i try to register a user i get:

Vite manifest not found at: C:\Lara Projects\base_auth\public\build/manifest.json

when i run npm run dev as suggested it just hangs there...

Best Answer

Level 102

@aifx4intel Yes it "hangs" as its a server. Its like running php artisan serve. You leave it "hanging" while developing and hit "ctrl+c" when you are done for the day.

But to fix the manifest error you just run npm run build

2 likes

Level 3

Ahhhh understood.

Thank you for your time.

Level 102

@aifx4intel Happy to help :) I know its a bit confusing, but once you get it, its really great. You might want to end each day by running "npm run build" to compile the assets in case you forget to start the dev server the next time you want to work on pure php

Level 3

@Sinnbeck so just to clarify...

npm run dev while busy with js /css or while building my app

and

npm run build is normally before deployment but at end of dev day if i didnt run the 1st cmd

Level 102

@aifx4intel Exactly. But be aware that the /public/build folder is in .gitignore so if you plan to build locally and push the assets to production, be sure to remove it from there :) (if you use git)

1 like

Level 3

@Sinnbeck perfect - Thanks

yogeshgalav