I've come to realize that I can easily make changes to the app.scss file in my Laravel projects and see those changes reflected by running npm run dev or npm run watch.
However, I'm faced with a dilemma when dealing with multiple .css files. Where should I store them and how do I go about compiling them?
Despite combing through the documentation and watching numerous Laracasts videos, I still haven't found a clear answer.
In the official documentation, it mentions:
Similar to the less method, you can compile various Sass files into their own CSS counterparts and even modify the output directory for the resulting CSS:
mix.sass('resources/sass/app.sass', 'public/css') .sass('resources/sass/admin.sass', 'public/css/admin');
So does this imply that if I have an admin.css file, I should rename it to admin.scss and place it within the sass directory? Would Laravel then automatically compile it and put it in public/css/admin? Do I need to convert each .css file into an .scss file and specify them individually in webpack.mix.js?
It might sound straightforward, but I've dedicated countless hours trying to grasp this concept.