不能編譯LESS文件導入CSS

我不太文件看起來像這樣：不能編譯LESS文件導入CSS

/*Style*/ 
.themeStyle(){ 
    font-weight:normal; 
    text-transform:capitalize; 
    text-transform:none; 
} 
.styleTitleBlock(@padding; @margin){ 
    text-transform:uppercase; 
    padding:@padding; 
    margin:@margin; 
    text-align: left; 
} 
.hideText(){ 
    display: inline-block; 
    text-indent: -99999px; 
    overflow: hidden; 
    vertical-align: middle; 
    text-align: left; 
    float: left; 
    .themeStyle(); 
} 
.themePosition(){ 
    position:absolute; 
    top:0; 
    left:0; 
} 
/*color text * color text hover*/ 
.link(@color; @colorhover){ 
    color: @color; 
    &:hover, 
    &:focus, 
    &:active { 
     color: @colorhover; 
     text-decoration:none; 
    } 
} 
/*========================= Functions==================*/ 
/*Change Font*/ 
.changeFont (@font){ 
    font: @font; 
} 

/*Change Text Color*/ 
.changeColor (@color){ 
    color: @color; 
} 
/*Change Line*/ 
.changeLine (@linecolor){ 
    border-color: @linecolor; 
} 
/*Change Background Color*/ 
.changeBkg (@bgkcolor){ 
    background-color: @bgkcolor; 
} 
/*Change Background Image Color*/ 
.changeBkg (@bkgcolor; @bkgurl; @bkgname; @bkgposition; @bkgrepeat){ 
    background-color:@bkgcolor; 
    background-image:url("@{bkgurl}@{bkgname}"); 
    background-position:@bkgposition; 
    background-repeat:@bkgrepeat; 

} 

/*Change Color-Border-Background Color*/ 
.changeAllColor(@color; @bgkcolor){ 
    .changeColor (@color); 
    .changeBkg (@bgkcolor); 
} 
.changeAllColor(@color; @linecolor; @bgkcolor){ 
    .changeColor (@color); 
    .changeLine (@linecolor); 
    .changeBkg (@bgkcolor); 
}

等我需要，因爲它似乎使用一個共享的主機上沒有LESS編譯器。所以我想預先編譯它。

lessc functions.less > functions.css

生成的css文件，但它只包含註釋 - 沒有代碼，沒有其他css指令。我做錯了什麼？我可以解決這個問題嗎？

來源

2015-04-23 Chris

什麼是預期的輸出？目前，你只有mixin。 – TiiJ7

這是因爲代碼只有帶有'（）'或參數混合的mixin，除非在另一個選擇器塊中調用，否則它們都不在編譯的CSS中輸出。 – Harry

是的，我看到 - 沒有（）它的工作原理 - 但似乎我必須重寫代碼。謝謝。 – Chris

您只有LESS文件中有mixin。 Mixins不會導致CSS輸出，如果不使用的話。有關mixin的更多信息，請參見LESS documentation（在您的案例中，參數混合）。

嘗試的選擇後，以刪除括號，就像這樣：

.hideText { 
    display: inline-block; 
    text-indent: -99999px; 
    overflow: hidden; 
    vertical-align: middle; 
    text-align: left; 
    float: left; 
    .themeStyle(); 
}

來源

2015-04-23 08:53:48

不能編譯LESS文件導入CSS

回答

相關問題