LentyStyle, .luis kaynak dosyalarını standart CSS'e dönüştüren bir derleme sistemidir. İhtiyaca göre browser runtime, hybrid veya SSR akışı ile çalışır.
LentyStyle Nedir?
Section titled “LentyStyle Nedir?”.luis, CSS'in üstüne kurulu bir kaynak katmanıdır. Değişkenler, döngüler, koşullar, fonksiyonlar ve observed selector'lar tanımlarsınız; çıktısı her zaman standart CSS olur.
Nasıl Çalışır?
Section titled “Nasıl Çalışır?”- Kaynak okunur
- Compiler çalışır
- Çıktı uygun akışa verilir
Akışlar:
- Tarayıcıda doğrudan CSS derleme
- Hybrid ile sayfa stillerinin ön çıktısını oluşturma
- SSR ile istek sırasında CSS içerikleri ekleme
Her akışta Observe aynı şekilde çalışmaya devam eder.
Tarayıcıda En Hızlı Kurulum
Section titled “Tarayıcıda En Hızlı Kurulum”<link rel="stylesheet" href="./styles.luis" data-luis><script src="/assets/lentystyle.min.js"></script>Bu akışta LentyStyle:
- Sayfaya eklenmiş
.luiskaynaklarını data-luis attribute'u ile veya .luis uzantısı ile bulur - Derler
- Sonucu CSS olarak sayfaya yazar
Paket Yükleyerek Nasıl Kullanabilirim?
Section titled “Paket Yükleyerek Nasıl Kullanabilirim?”Stilleri tarayıcı tarafında çalışırken üretmek istiyorsanız:
pnpm add @lentystyle/corenpm install @lentystyle/coreyarn add @lentystyle/coreİlk yükü hafifletmek ve sayfa bazlı stilleri önden hazırlamak istiyorsanız:
pnpm add @lentystyle/hybridnpm install @lentystyle/hybridyarn add @lentystyle/hybridHangi Paket Ne Zaman Kullanılır?
Section titled “Hangi Paket Ne Zaman Kullanılır?”@lentystyle/core/runtime kullanın. Eklediğiniz luis içeriklerini derler ve CSS olarak sayfaya yazar.
@lentystyle/hybrid kullanın. Sayfa bazlı luis içeriklerinin önceden derlenmiş stillerini sayfaya ekler, Observe ile sayfa içeriklerini takip etmeye devam eder.
@lentystyle/ssr kullanın. Hybrid ile birlikte çalışır ve her istekte sayfa stillerinin önden derlenmiş halini sayfaya ekler.