How to implement a css template in my project?

I have installed Gentelella css admin template through npm, the various css and js dependencies of the template are in the vendor directory inside the Gentelella directory that is in the node_modules directory. My question is what is a good approach to manage these dependencies in my web pages. Do i copy every dependency file that i will need to my public/ directory, do i bundle all the dependencies that i will need in one file and then put that one file in public/? What is a good way to handle this situation?

Thanks in advance.

Jelmer

7 years ago

Level 14

Mix it up and publish to public/css/vendor

Cronix

7 years ago

Best Answer

Level 67

Use mix: https://laravel.com/docs/5.6/mix

Then you'd have something like this in your webpack.mix.js file

mix.copy('node_modules/sweetalert2/dist/sweetalert2.js', 'public/js/sweetalert.min.js')

So it will copy the file from your node_modules dir into the public/js dir

After you have your mix file setup, you just run npm run dev and it will do the work. Mix is quite powerful. You might not see the utility of it by just copying these files, but it can also minify things, version them (for cache busting in the browser), compile your less/sass (if you have any), combine multiple files into a single file (maybe you want all css compiled into a single css file) and many more things.

Please or to participate in this conversation.