LESS @import & Web Essentials 2012

Question

Web projemde, CSS'yi bakım nedenleriyle ayrı ayrı LESS dosyalarına böldüm. @import yönergelerini kullanarak diğer daha az dosyaları içe aktaran bir ana dosya olarak hareket eden config.less adlı bir dosyam var.

Bu kurulumdaki sorun, LESS dosyalarınızı düzenlerken çok fazla "Tanımlanamayan değişken" & "Tanımlanamayan karışım" elde etmem, örneğin base.less dosyasında @textColor adında bir özellik değişkeni eklerken olduğu gibi görünüyor. variable.less adlı başka bir daha az dosyada bildirildi. Web temellerinin harici dosyalarda tanımlanmış değişkenler ve karıĢımlardan haberdar edilmesinin bir yolu var mıdır?

.some-selector { 
    background: #000; 
    @media only screen and (max-width: 800px) { 
     background: #fff; 
    } 
} 

iç içe @media beyan fareyle üzerine kırmızı altı çizili alır ve şöyle der: Ben LDŞÖ'nün iç içe medya sorgusu özelliğini kullanarak olduğumda

Web Essentials kadar açma gibi görünüyor başka bir şey değildir "Stil kuralındaki beklenmedik '@' bloğu". İç içe geçmiş arka plan özelliğinin üzerine gelindiğinde, "Doğrulama: 'renk' geçerli bir HTML etiketini gösterir.

Answer 1

Web Essentials ile @media ile ilgili bir yanıt veremiyorum, ancak değişkenler ve karışmalar sorunu hakkında öneride bulunabilirim.

Temelde, daha sonra da (kullanılan herhangi mixin dosyaları için aynı şeyi) ondan değişkenleri kullanan her dosyaya @import-once 'variables.less ekleyin @import-once olmak variables.less ve diğer mixin dosyaları için config.less dosyayı değiştirin.

Bunun üzerinde çalışıyorsanız, dosyayı (base.less'unuz gibi) içe aktarır. Tüm dosyalar config.less tarafından derlenir, variables.less yalnızca bir kez içe aktarılır ve variables.less da başvuruda bulunan her bir dosya için tekrar değil.