for循环在更少的css mixin中不起作用

Question

I have noticed that a piece of Less I thought was working as expected is not actually generating all the styles I need - my for loop is not working.

The less in question is:

.for(@list, @code) {
    & {
        .loop(@i:1) when (@i =< length(@list)) {
            @value: extract(@list, @i);

            @code();

            .loop(@i + 1);
        }

        .loop();
    }
}

.role-variants(@variants, @props){
    .for(@variants, {
      .security_class_@{value} {
        @props();
      }
    });
}

@admin-roles: admin, admin_manager, admin_user, admin_manager_user;

html{
    body{
        &.admin{
            .role-variants(@admin-roles, {display: block;});
        }
    }
}

on http://less2css.org/ this compiles correctly, generating the classes I expect.

When I compile locally, I only get the following class:

html body.admin .security_class_admin {
    display: block
}

My for loop is not working locally, though it seems to be valid and working using the less compiler. Any ideas on how I can modify it to work locally, or perhaps I need to update my environment to a specific version, though it seems to be up to date.

Thanks again for your help.

Jamie

Answer 1

my loop was malformed - this loop now works as expected:

.for(@list, @code) {
    & {
        .loop(@i) when (@i > 0) {
            @value: extract(@list, @i);
            @code();
            .loop((@i - 1));
        }
        .loop(length(@list));
    }
}