purpose of vite ?

@Tray2 There's documentation for this stuff? 😊

@jlrdw I know, it totally blew my mind, who would have thought such thing existed . ;P

@Tray2 Thanks for the reply, but I did not understand it from the docs. If I did, why would I come to the Laracasts discussion.

After running npm run build, it will load a one file, resulting in less asset loading in the browser's network.

In simple words, I need to run it in production, not in development, to get the expected behavior.

@jlrdw I have another question. Should I use asset() to load my images, or should I use Vite::asset()?

Will Vite::asset() optimize my images at loading time? If yes, then I'll use Vite::asset(). if not than it's okay to use asset(), right?

Second question:

After the build, Vite copy all my assets from 'resources/assets' to 'public/build/assets' Now we have assets in two different locations. How do I delete them from 'resources/assets'? Is there a command for it, or do I have to do it manually?

Or do we even need to delete them, since we are now in a production environment?

@abdulrehman176617 The reason for running npm run dev during development is hot module replacement (HMR). That means any change you make is immediately reflected on your web page; no asset bundling (or even a page reload) is needed. You only want to bundle the assets when you're deploying to production.

@abdulrehman176617

After the build, Vite copy all my assets from 'resources/assets' to 'public/build/assets' Now we have assets in two different locations. How do I delete them from 'resources/assets'? Is there a command for it, or do I have to do it manually?

You don't delete them. Public assets are built from your resources. If you delete them, you can no longer rebuild.

@abdulrehman176617 For production you just run npm run build then it will build the asset files. The vite helper is then loading your compiled assets.

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