меньше CSS избежать глобализованной переменной - PullRequest
Новая
       4

меньше CSS избежать глобализованной переменной

0 голосов
/ 21 февраля 2019

Я ищу лучший способ избежать глобально рассеянных переменных.

Я провел тест с этой конфигурацией:

_import.less 

@test: #FFF;

_import2.less 

@test: #000;

test.less 

@import (reference) "_import";

body {
    background: @test;
}

test2.less 

@import (reference) "_import2";

div {
    background: @test;
}

index.less 

@import "test";
@import "test2";

Вывод с lessc index.less test.css по-прежнему выглядит как 

body {
  background: #000;
}
div {
  background: #000;
}

Но что яищу это: 

body {
  background: #FFF;
}
div {
  background: #000;
}

Использование менее 2,7 или 3,9 дает такое же поведение.
Кто-нибудь знает решение?
Спасибо

1 Ответ

0 голосов
/ 21 февраля 2019

Вы всегда можете выделить область действия чего угодно (включая импортированный файл), используя «безымянное пространство имен», то есть & {}, block.

Например:

test.меньше : 

@import "_import";

body {
    background: @test;
}

test2.less : 

@import "_import2";

div {
    background: @test;
}

index.less : 

& {@import "test";}
& {@import "test2";}

В зависимости от ваших целей эти & {} блоки можно перемещать прямо в сами файлы test.

---

Ref: Определение локальной переменной в файлах импорта

...