Laravel elixir compile multiple less files

Question

I have this two files in resources/assets/less folder style.less and admin/style.less. I want to compile this files to diffrent paths as the following:

style.less compiled to public/css/

and the other one compiled to public/admin/styles/

this is What i did in the gulpfile.js

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

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

Idob · Accepted Answer · 2017-07-05 17:39:42Z

1

I have a project that compiles two different less files to two different css files. The only difference that I see is that I 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');
});

answered Jul 5, 2017 at 17:39

Idob

1,6605 gold badges16 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sameer · Accepted Answer · 2015-03-29 18:06:58Z

0

I have not got the answer for this yet. But have tried some alternatives, thought will share.

I was thinking we can do like below

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

But according to the documentation we can't make multiple call to sass or less method. So it is only compiling the latest less file (which in this case admin/style.css).

We can do like this

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

but this will compile both into the same folder.

Hoping to know, how can we do it to different folders.

I tried copying the second file into a separate folder, but that also doesn't work

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

Probably this is because each requests are async and when the copy is getting called, that time the style2.css is not ready yet.

edited Mar 29, 2015 at 18:06

answered Mar 29, 2015 at 14:54

Sameer

1,8344 gold badges17 silver badges21 bronze badges

3 Comments

Marcin Nabiałek Over a year ago

Are you sure it will work? As far as I know for sass it doesn't

Sameer Over a year ago

Sorry Marcin, It doesn't. Looks like we can only use one instance of less or sass function according to the documentation. I take back my answer. I assumed it will. Sorry!

astroanu Over a year ago

for less/sass you can import one less/sass in to another. but it works for a single file format obviously.

Garf365 · Accepted Answer · 2017-10-27 12:42:44Z

0

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

edited Oct 27, 2017 at 12:42

Garf365

3,7075 gold badges33 silver badges42 bronze badges

answered Oct 27, 2017 at 12:25

Igor Ostapchuk

13 bronze badges

Collectives™ on Stack Overflow

Laravel elixir compile multiple less files

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related