Nierejestrowana zmienna z LESS @import. Co to powoduje? Czy jest poprawka?

Question

Mam 2 pliki LESS. Globals.less i Site.less. Globals.less zawiera wszystkie moje zmienne globalne (dane wyjściowe) i import do definicji resetowania CSS. Site.less zawiera używane style.

Globals.less:

//Imports 
@import "CSSReset.less"; 

//Colors 
@color-background: rgb(0, 0 , 0); 

Site.less:

@import "Globals.less"; 

body { 
    background: @color-background url('/Images/BackgroundTextureBody.png'); 
} 

Problem jest następujący: W Visual Studio @ kolor tła w Site.less jest podkreślony, a błąd jest „nielegalna zmienna ", ale kompilacja LESS do CSS jest w porządku, a kolor tła jest odpowiednio ustawiony na # 000. Jest to bardziej irytujące niż cokolwiek innego, ale tracę IntelliSense i otrzymuję ostrzeżenia na mojej liście błędów. Chciałbym, aby redaktor działał zgodnie z oczekiwaniami i był w stanie "zobaczyć" moje deklaracje w Globals.less, gdy edytuję Site.less. Czy robię coś złego, czy jest to błąd, czy moje środowisko nie jest poprawnie skonfigurowane?

Answer 1

Okazuje się, że korzystałem ze starszej wersji programu Web Essentials 2012. Pierwszą rzeczą, którą powinienem sprawdzić i nie zrobić, to upewnić się, że moje środowisko było aktualne. Aktualizacja programu Web Essentials do najnowszej wersji rozwiązała problem.

Answer 2

Wydaje się, że Visual Studio (lub jest to mniej tłumacza) nie rozumie zakres zmiennej ciągu importowanych Globals.less

Importowanie zmiennych jest normalny i zdrowy rzeczą do zrobienia, więc sugeruję, że jest to błąd lub brakująca funkcja w konfiguracji Visual Studio.

Answer 3

Aby uzyskać intellisense dla konkretnego pliku less, możesz dodać ścieżkę referencyjną w taki sam sposób, w jaki chcesz uzyskać intellisense w pliku js.

Przykład

/// <reference path="Globals.less" /> 

@import "Globals.less"; 

body { 
    background: @color-background url('/Images/BackgroundTextureBody.png'); 
}