Katkıda bulunmak
Belge oluşturma komut dosyalarımız ve testlerimizle Bootstrap'in geliştirilmesine yardımcı olun.
Takım kurulumu
Bootstrap , belgeleri oluşturmak ve kaynak dosyaları derlemek için npm komut dosyalarını kullanır. package.json'umuz , kod derlemek, testleri çalıştırmak ve daha fazlası için bu komut dosyalarını barındırır. Bunlar, depomuz ve belgelerimiz dışında kullanılmak üzere tasarlanmamıştır.
Yapı sistemimizi kullanmak ve belgelerimizi yerel olarak çalıştırmak için Bootstrap'in kaynak dosyalarının ve Node.js dosyasının bir kopyasına ihtiyacınız olacak. Bu adımları izleyin ve sallanmaya hazır olmalısınız:
- Bağımlılıklarımızı yönetmek için kullandığımız Node.js'yi indirip yükleyin .
- Ya Bootstrap'in kaynaklarını indirin ya da Bootstrap deposunu çatallayın .
/bootstrap
Kök dizine gidin ve package.jsonnpm install
içinde listelenen yerel bağımlılıklarımızı yüklemek için çalıştırın .
Tamamlandığında, komut satırından sağlanan çeşitli komutları çalıştırabileceksiniz.
npm komut dosyalarını kullanma
Paketimiz.json , projeyi geliştirmek için çok sayıda görev içerir. npm run
Terminalinizdeki tüm npm komut dosyalarını görmek için çalıştırın . Birincil görevler şunları içerir:
Görev | Tanım |
---|---|
npm start |
CSS ve JavaScript'i derler, belgeleri oluşturur ve yerel bir sunucu başlatır. |
npm run dist |
dist/ Derlenmiş dosyalarla dizini oluşturur . Sass , Autoprefixer ve terser kullanır . |
npm test |
Çalıştırdıktan sonra testleri yerel olarak çalıştırırnpm run dist |
npm run docs-serve |
Belgeleri yerel olarak oluşturur ve çalıştırır. |
küstah
Bootstrap, Sass kaynak dosyalarımızı CSS dosyalarına derlemek için Dart Sass'ı kullanır (oluşturma sürecimize dahildir) ve kendi varlık işlem hattınızı kullanarak Sass'ı derliyorsanız aynısını yapmanızı öneririz. Daha önce Bootstrap v4 için Node Sass kullanıyorduk, ancak LibSass ve Node Sass da dahil olmak üzere bunun üzerine inşa edilen paketler artık kullanımdan kaldırıldı .
Dart Sass, 10'luk bir yuvarlama hassasiyeti kullanır ve verimlilik nedenleriyle bu değerin ayarlanmasına izin vermez. Bu hassasiyeti, küçültme sırasında olduğu gibi, oluşturulan CSS'nin daha sonraki işlenmesi sırasında düşürmeyiz, ancak bunu yapmayı seçtiyseniz, tarayıcı yuvarlama ile ilgili sorunları önlemek için hassasiyeti en az 6 olarak korumanızı öneririz.
otomatik ön ek
Bootstrap, derleme sırasında bazı CSS özelliklerine satıcı öneklerini otomatik olarak eklemek için Autoprefixer'ı (yapı sürecimize dahildir) kullanır. Bunu yapmak, v3'te bulunanlar gibi satıcı karışımlarına olan ihtiyacı ortadan kaldırırken CSS'mizin önemli kısımlarını tek seferde yazmamıza izin vererek zamandan ve koddan tasarruf etmemizi sağlar.
Autoprefixer aracılığıyla desteklenen tarayıcıların listesini GitHub depomuzda ayrı bir dosyada tutuyoruz. Ayrıntılar için .browserslistrc'ye bakın .
RTLCSS
Bootstrap, derlenmiş CSS'yi işlemek ve bunları RTL'ye dönüştürmek için RTLCSS'yipadding-left
kullanır – temel olarak yatay yöne duyarlı özellikleri (örn . ) karşıtlarıyla değiştirir. CSS'imizi yalnızca bir defa yazmamıza ve RTLCSS kontrol ve değer yönergelerini kullanarak küçük değişiklikler yapmamıza izin verir.
Yerel belgeler
Belgelerimizi yerel olarak çalıştırmak, hugo-bin npm paketi aracılığıyla yüklenen Hugo'nun kullanılmasını gerektirir . Hugo, bize temel içerikler, Markdown tabanlı dosyalar, şablonlar ve daha fazlasını sağlayan son derece hızlı ve oldukça genişletilebilir bir statik site oluşturucudur. Nasıl başlayacağınız aşağıda açıklanmıştır:
- Tüm bağımlılıkları yüklemek için yukarıdaki araç kurulumunu çalıştırın .
- Kök dizinden komut satırında
/bootstrap
çalıştırın .npm run docs-serve
http://localhost:9001/
Tarayıcınızda açın ve voilà.
Belgelerini okuyarak Hugo'yu kullanma hakkında daha fazla bilgi edinin .
Sorun giderme
Bağımlılıkları yüklemeyle ilgili sorunlarla karşılaşırsanız, önceki tüm bağımlılık sürümlerini (genel ve yerel) kaldırın. Ardından, yeniden çalıştırın npm install
.