2012-03-09 7 views
1

Lesscssで私のCSSをクライアントサイド(コンパイラless.js)で書いています。レースミックスガード付き。構文エラー

ドキュメントにはガードの使用例がありますが、それは私にとっては役に立ちません。コードはドキュメントによって書かれた

@import "common-functions.less"; 

// variables 
@minHeaderWidth: auto; 
@maxHeaderWidth: 1200px; 

@minButtonsWidth: 50px; 
@maxButtonsWidth: 75px; 

// Mixins with guards 
.applyHeaderStyles(@headerWidth, @buttonsWidth) when (ispixel(@headerWidth)) { 
    .my-headerElement { 
     width: @headerWidth; 
    } 
} 
.applyHeaderStyles(@headerWidth, @buttonsWidth) when not (ispixel(@headerWidth)) { 
    .my-headerElement { 
     width: @headerWidth; 
     margin: 0 @buttonsWidth; 
    } 
} 

// than I use .applyHeaderWidth in @media queries 
@media screen and (min-width: 1050px) { 
    .applyHeaderStyles(@maxHeaderWidth, @maxButtonsWidth); 
    .my-buttonElement {width: @maxButtonsWidth;} 
} 
@media screen and (max-width: 1049px) { 
    .applyHeaderStyles(@minHeaderWidth, @minButtonsWidth); 
    .my-buttonElement {width: @minButtonsWidth;} 
} 

:...

コード例をここになぜ私は、理解することはできません。しかし、それは動作しません。 は、私はこのコードを実行すると、私は構文エラーがあります。

 
Syntax Error on line 10 
[link to my file] on line 10, column 58: 
10 // Mixins with guards 
11 .applyHeaderStyles(@headerWidth, @buttonsWidth) when (ispixel(@headerWidth)) { 
12  .my-headerElement { 
+0

私は1.2.2にバージョンless.js更新しました。そして今、それは動作します。 回答:リンク: http://stackoverflow.com/questions/9491716/less-js-guards-and-conditionals – VikomiC

+0

あなた自身で答えを見つけた場合は、自分で回答を投稿し、それを受け入れることをお勧めします。タイトルに「SOLVED」と記入してください。 SO!へようこそ! –

答えて

1

としては、1.2.2で問題が解決less.jsする更新、hereを述べました。 changelogから

1.2.0 
Mixin guards