.css dosyasını .less dosyasına aktar

.Css dosyalarını .less dosyalarına aktarabilir misiniz?

Daha azını çok iyi biliyorum ve bunu tüm gelişimim için kullanıyorum. Düzenli olarak şu şekilde bir yapı kullanıyorum:

@import "normalize";

//styles here

@import "mixins";
@import "media-queries";
@import "print";

Tüm içe aktarmalar diğer .less dosyalarıdır ve olması gerektiği gibi çalışır.

Şu anki sorunum şu: .css dosyasında kullanılan biçemlere aşağıdaki gibi başvuran bir .css dosyasını .less dosyasına aktarmak istiyorum:

@import "../style.css";

.small {
    font-size:60%;
    .type;
}
// other styles here

.type.Css dosyası adlı bir sınıf içeriyor ancak .less dosyasını derlemeye çalıştığımda hatayı alıyorumNameError: .type is undefined

.Less dosyası .css dosyalarını içe aktarmayacak, sadece diğer .less dosyalarını içe aktarmayacak mı? Yoksa yanlış mı atıfta bulunuyorum ...?!

Bir seçenek belirleyerek bir dosyayı belirli bir tür olarak yorumlanmaya zorlayabilirsiniz, örneğin:

@import (css) "lib";

çıktı olacak

@import "lib";

ve

@import (less) "lib.css";

lib.cssdosyayı içe aktaracak ve daha az sayılacaktır. Bir dosyanın daha az olduğunu ve uzantı içermediğini belirtirseniz hiçbiri eklenmez.

CSS'nizin işlenmeden çıktıya kopyalanmasını istiyorsanız, (inline)yönergeyi kullanabilirsiniz . Örneğin,

@import (inline) '../timepicker/jquery.ui.timepicker.css';

1.7.4 sürümü ile aşağıdakileri kullanmak zorunda kaldım

@import (less) "foo.css"

Kabul edilen cevabın olduğunu biliyorum @import (css) "foo.css"ama işe yaramadı. Eğer yeni az dosyasında css sınıfını yeniden kullanmak istiyorsanız, kullanmak gerek (less)değil(css) .

Dokümanları kontrol edin .

Css dosyanızın dosya uzantısını olarak değiştirin .less. İçine DAHA AZ yazmanıza gerek yok; tüm CSS geçerli DAHA AZ (kaçmak zorunda MS şeyler hariç, ama bu başka bir sorun.)

Fractalf'ın cevabı başına bu v1.4.0'da düzeltildi

Gönderen AZ web :

Bir CSS dosyasını almak istiyorsanız ve LESS'in işlemesini istemiyorsanız, sadece .css uzantısını kullanın:

@import "lib.css"; Yönerge olduğu gibi bırakılacak ve CSS çıktısına eklenecektir.

Aşağıdaki yorumlarda jitbit'in işaret ettiği gibi, gereksiz geliştirme @importtüketen değerli bant genişliğine sahip olmak istemeyeceğiniz için bu sadece geliştirme amaçlı olarak yararlıdır .

Bunu dene :

@import "lib.css";

Resmi Belgelerden:

Hem css hem de daha az dosyayı içe aktarabilirsiniz. Yalnızca daha az dosya içe aktarma ifadesi işlenir, css dosyası içe aktarma ifadeleri oldukları gibi tutulur. Bir CSS dosyasını almak istiyorsanız ve LESS'in işlemesini istemiyorsanız, sadece .css uzantısını kullanın:

Kaynak: http://lesscss.org/

Eğer sadece bir referans olarak CSS-Dosya aktarmak istiyorsanız (örneğin Mixins sınıfları kullanmak için) ama değil kullanabilirsiniz sonucu bütün CSS dosyasını dahil@import (less,reference) "reference.css"; :

my.less

 @import (less,reference) "reference.css";
 .my-class{
     background-color:black;
     .reference-class;
     color:blue;
 }

reference.css

.reference-class{
    border: 1px solid red;
}

* İle sonuç (my.css) lessc my.less out/my.css*

.my-class {
  background-color: black;
  border: 1px solid red;
  color: blue;
}

kullanıyorum lessc 2.5.3

Daha az işlenmesi gereken bir css dosyasını içe aktarmak istiyorsanız bu satırı kullanın:

.ie {
  @import (less) 'ie.css';
}

1.5.0'dan beri u 'satır içi' anahtar kelimesini kullanabilirsiniz.

Örnek: @import (satır içi) "daha az uyumlu olmayan .css";

Bir CSS dosyası Daha az uyumlu olmayabilir; bunun nedeni, Less'in bilinen CSS standartlarının çoğunu desteklemesine rağmen, bazı yerlerde yorumları desteklememesi ve CSS'yi değiştirmeden bilinen tüm CSS saldırılarını desteklememesidir. Böylece, tüm CSS'lerin tek bir dosyada olması için dosyayı çıktıya dahil etmek için bunu kullanabilirsiniz.

(kaynak: http://lesscss.org/features/#import-directives-feature )