Lumpat menyang isi utama Lumpat menyang pandhu arah docs
Check
in English

nyumbang

Mbantu ngembangake Bootstrap kanthi dokumentasi mbangun skrip lan tes.

Setelan perkakas

Bootstrap nggunakake skrip npm kanggo mbangun dokumentasi lan ngumpulake file sumber. Package.json kita ngemot skrip iki kanggo nyusun kode, nglakokake tes, lan liya-liyane. Iki ora dimaksudake kanggo digunakake ing njaba repositori lan dokumentasi.

Kanggo nggunakake sistem mbangun lan mbukak dokumentasi lokal, sampeyan butuh salinan file sumber Bootstrap lan Node. Tindakake langkah iki lan sampeyan kudu siap kanggo rock:

  1. Ngundhuh lan nginstal Node.js , sing digunakake kanggo ngatur dependensi kita.
  2. Ngundhuh sumber Bootstrap utawa garpu gudang Bootstrap .
  3. /bootstrapNavigasi menyang direktori root lan mbukak npm installkanggo nginstal dependensi lokal sing kadhaptar ing package.json .

Yen wis rampung, sampeyan bakal bisa mbukak macem-macem printah sing kasedhiya saka baris printah.

Nggunakake skrip npm

Package.json kita kalebu akeh tugas kanggo ngembangake proyek kasebut. Mbukak npm runkanggo ndeleng kabeh skrip npm ing terminal sampeyan. Tugas utama kalebu:

tugas Katrangan
npm start Kompilasi CSS lan JavaScript, mbangun dokumentasi, lan miwiti server lokal.
npm run dist Nggawe dist/direktori kanthi file sing dikompilasi. Migunakake Sass , Autoprefixer , lan terser .
npm test Nglakokake tes sacara lokal sawise mlakunpm run dist
npm run docs-serve Mbangun lan mbukak dokumentasi lokal.
Miwiti Bootstrap liwat npm karo proyek wiwitan kita! Pindhah menyang repositori template twbs/bootstrap-npm-starter kanggo ndeleng carane mbangun lan ngatur Bootstrap ing proyek npm sampeyan dhewe. Kalebu kompiler Sass, Autoprefixer, Stylelint, PurgeCSS, lan Ikon Bootstrap.

Sass

Bootstrap nggunakake Dart Sass kanggo ngumpulake file sumber Sass menyang file CSS (kalebu ing proses mbangun), lan disaranake sampeyan nindakake perkara sing padha yen sampeyan nyusun Sass nggunakake pipa aset sampeyan dhewe. Kita sadurunge nggunakake Node Sass kanggo Bootstrap v4, nanging LibSass lan paket sing dibangun ing ndhuwur, kalebu Node Sass, saiki wis ora digunakake .

Dart Sass nggunakake tliti babak 10 lan kanggo alasan efficiency ora ngidini imbuhan saka Nilai iki. Kita ora ngedhunake presisi iki sajrone proses luwih lanjut saka CSS sing digawe, kayata nalika minifikasi, nanging yen sampeyan milih nglakoni, disaranake njaga presisi paling sethithik 6 kanggo nyegah masalah karo pembulatan browser.

Autoprefixer

Bootstrap nggunakake Autoprefixer (kalebu ing proses mbangun) kanthi otomatis nambahake awalan vendor menyang sawetara properti CSS ing wektu mbangun. Mengkono ngirit wektu lan kode kanthi ngidini kita nulis bagean-bagean penting saka CSS kita siji-sijine nalika ngilangi kabutuhan mixin vendor kaya sing ditemokake ing v3.

Kita njaga dhaptar browser sing didhukung liwat Autoprefixer ing file sing kapisah ing repositori GitHub. Waca .browserslistrc kanggo rincian.

RTLCSS

Bootstrap nggunakake RTLCSS kanggo ngolah CSS sing dikompilasi lan ngowahi dadi RTL - biasane ngganti sifat sing ngerti arah horisontal (contone padding-left) kanthi ngelawan. Ngidini kita mung nulis CSS siji-sijine lan nggawe njiwet cilik nggunakake kontrol RTLCSS lan arahan nilai .

Dokumentasi lokal

Nglakokake dokumentasi kita sacara lokal mbutuhake panggunaan Hugo, sing bakal diinstal liwat paket npm hugo-bin . Hugo minangka generator situs statis sing cepet banget lan cukup extensible sing nyedhiyakake: dhasar kalebu, file basis Markdown, template, lan liya-liyane. Mangkene carane miwiti:

  1. Bukak persiyapan perkakas ing ndhuwur kanggo nginstal kabeh dependensi.
  2. /bootstrapSaka direktori root , mbukak npm run docs-serveing baris printah.
  3. Bukak http://localhost:9001/ing browser sampeyan, lan voilà.

Sinau luwih lengkap babagan nggunakake Hugo kanthi maca dokumentasi .

Ngatasi masalah

Yen sampeyan nemoni masalah nalika nginstal dependensi, instal kabeh versi dependensi sadurunge (global lan lokal). Banjur, mbukak maneh npm install.