Laravel elixir will compile fewer files less

Question

I have two files in the resources/assets/less style.less and admin/style.less . I want to compile these files in different ways as follows:

style.less compiled in public/css/

and the other compiled into public/admin/styles/

this is what i did in gulpfile.js

 elixir(function(mix) { mix.less('style.less', 'public/css/'); mix.less('admin/style.less', 'public/admin/styles/'); }); 

but this will compile only one file. What is the problem and how can I fix this problem?

Answer 1

I have a project that will compile two different files less than two css files. The only difference that I see is to specify the full destination path, including the file name.

So, for your case it will be:

 elixir(function(mix) { mix.less('style.less', 'public/css/style.css') .less('admin/style.less', 'public/admin/styles/style.css'); }); 

Answer 2

I have no answer yet. But they tried some alternatives, thought about it.

I thought we can do as below

 elixir(function(mix) { mix.less('style.less', 'public/css/') .less('admin/style.less', 'public/admin/styles/'); }); 

But according to the documentation, we cannot make multiple calls using the sass or less method. So this is just a compilation of the last smaller file (which in this case is admin / style.css).

We can do this:

 elixir(function(mix) { mix.less(['style.less', 'admin/style2.less'], 'public/css/'); }); 

but it compiles to the same folder.

Hoping to find out how we can do this in different folders.

I tried to copy the second file to a separate folder, but this also does not work

 elixir(function(mix) { mix.less(['style.less', 'admin/style2.less'], 'public/css/') .copy('public/css/style2.css', 'public/admin/style.css'); }); 

This is probably because each request is asynchronous, and when the copy receives the call, then style2.css is not ready yet.

Answer 3

 mix.less('resources/assets/less/app.scss', 'public/css'). less('resources/assets/less/admin/style.less', 'public/admin/styles');