For a better readability and understandability, Less variables should be defined at the beginning of their block.

@charset and @import rules are allowed before Less variable declarations.

Noncompliant Code Example

@charset "UTF-8";

.mybox1 {
  color: @var1;
  @var1: blue; /* Noncompliant */
  @var2: green; /* Noncompliant */

  > .mybox2 {
    border-color: @var3;
    @var3: black; /* Noncompliant */
  }

  background-color: @var2;
  border: @var0;
}

@var0: 1px; /* Noncompliant */

Compliant Solution

@charset "UTF-8";

@var0: 1px;

.mybox1 {
  @var1: blue;
  @var2: green;
  color: @var1;

  > .mybox2 {
    @var3: black;
    border-color: @var3;
  }

  background-color: @var2;
  border: @var0;
}