Where do I include custom JS and CSS files in Laravel 9?

user_13344197 0
Viewed 492

I'm manually downloading these CSS and JS files from: https://github.com/1j01/os-gui

I'm not sure where in my Laravel 9 app I should place the CSS and JS files.

What's the proper way to do it? Should I just download and place the files in the public directory? But shouldn't I be utilizing Laravel 9's Mix to compile the JS CSS files, and if so how can I go about doing that?

This is the list of files I want to use:

css/layout.css
css/windows-98.css
css/windows-default.css
js/$Window.js
js/MenuBar.js
js/parse-theme.js
js/demo.js
js/jquery-3.3.1.js // i'll probably use v3.6.0 (or whatever is the latest version)
laravel-9 laravel css html javascript
1 Answers

If you want those files to be optimized and controlled and also want that every request does not download a bunch of css and js files, you should use laravel mix which is installed by default

You should put those files inside /resources folder and compile them into a single file, adittionally you could purge with the mix purge plugin so your assets will be purged/optimized.

This is really simple in your webpack.mix.js

mix.js('resources/js/app.js', 'public/js')
    .css('resources/css/app.css', 'public/css', [
        // and in your app.css you can @import every css you need to load 
    ]);
user_165672100
Related