How to use Sass in Laravel with Vite

hello everyone welcome to dave tomine if you like this video don't forget to click like subscribe and comment down below in this video i'm going to show you how to use scss or set in laravel with feed so actually la level 9 come with v directly you will see feed over here is support feed directly instead of a mix okay in order to use that you need to go to resources right click create new folder name is scss then right click and create a new file app.scss okay this is the css file that we are going to use with blade so the next step you need to go to vconfig.js next we are going to include these files app.css over here you put resource and then sc css and f dot s c address then we go to blade so just remove this one this is a default html the welcome page html of laravel okay remove this one the next step that you have to do is to install sets preprocessor okay go to terminal and new terminal so let me open google chrome if you go to v document and go to features and go to cds over here and then you will see that we does provide built-in support for scs but the corresponding preprocessor itself must be installed so you need to install by running this command npm at dstat but first of all you need to type npm install next you need to type this command npm at d says npm add dash d says okay then type npm run div to compile the bundle and over here in blade files you need to include feed add feed okay you have to include these files so you can include only these files or you can include all of them okay or you can do it like this if you wanna include css in these uh blitz files css app css if you want to include javascript you can copy this one and paste it over here as well it will include all these three files into front end okay all right let's go to welcome blade.php i will create a sample html over here to see if sas is working class container h1 hello sass okay let me run psp artisan serve to run laravel server okay let me open this one you will see that halo says over here all right let's put some styles over here container background color green okay then put h1 inside container and then put font size 20 pixel and then font styles italic okay save and let's see if it's work okay this worked all right this is all about this video and if you like this video don't forget to click like subscribe and comment down below thank you so much for watching

Channel: Devtamin

Views: 17,740

Keywords: laravel, Laravel, Laravel Framework, Laravel framework, Laravel basic, Laravel tutorial, install laravel, Laravel for begginers, start laravel, set up laravel, php laravel, laravel 2022, laravel crash course, laravel from scratch, basic laravel, laravel installation, learn laravel, laravel 9, Vite, Laravel Vite, Vite laravel, Laravel Sass, Laravel Scss, Laravel SCSS, Install Sass in Laravel, Sass Vite Laravel, Laravel Vite Scss, Sass in Laravel, Sass/SCSS Laravel

Id: o2h6tThS05w

Length: 4min 25sec (265 seconds)

Published: Tue Jul 26 2022