Luncat ka eusi utama Luncat ka navigasi docs
in English

Ngawangun parabot

Diajar kumaha ngagunakeun skrip npm kalebet Bootstrap pikeun ngawangun dokuméntasi kami, nyusun kode sumber, ngajalankeun tés, sareng seueur deui.

Setélan pakakas

Bootstrap nganggo skrip npm pikeun sistem ngawangunna. package.json kami ngawengku métode merenah pikeun gawé bareng kerangka, kaasup kode compiling, ngajalankeun tés, sareng nu sanesna.

Pikeun nganggo sistem ngawangun kami sareng ngajalankeun dokuméntasi kami sacara lokal, anjeun peryogi salinan file sumber Bootstrap sareng Node. Turutan léngkah-léngkah ieu sareng anjeun kedah siap ngagulung:

  1. Ngundeur tur masang Node.js , nu urang pake pikeun ngatur kagumantungan urang.
  2. Boh unduh sumber Bootstrap atanapi garpu gudang Bootstrap .
  3. /bootstrapNapigasi ka diréktori root tur ngajalankeun npm installmasang dependensi lokal urang didaptarkeun di package.json .

Nalika réngsé, anjeun bakal tiasa ngajalankeun rupa-rupa paréntah anu disayogikeun tina garis paréntah.

Ngagunakeun skrip npm

package.json kami ngawengku sababaraha pancén pikeun ngembangkeun proyek. Jalankeun npm runpikeun ningali sadaya skrip npm dina terminal anjeun. tugas primér ngawengku:

Tugas Katerangan
npm start Nyusun CSS sareng JavaScript, ngawangun dokuméntasi, sareng ngamimitian server lokal.
npm run dist Nyiptakeun dist/diréktori sareng file anu disusun. Merlukeun Sass , Autoprefixer , jeung terser .
npm test Ngajalankeun tés sacara lokal saatos ngajalankeunnpm run dist
npm run docs-serve Ngawangun sareng ngajalankeun dokuméntasi sacara lokal.
Mimitian ku Bootstrap via npm sareng proyék starter kami! Sirah kana repositori template twbs/bootstrap-npm-starter pikeun ningali kumaha ngawangun sareng ngaropea Bootstrap dina proyék npm anjeun nyalira. Ngawengku kompiler Sass, Autoprefixer, Stylelint, PurgeCSS, sareng Ikon Bootstrap.

Sass

Bootstrap nganggo Dart Sass pikeun nyusun file sumber Sass kami kana file CSS (kaasup dina prosés ngawangun kami), sareng kami nyarankeun anjeun ngalakukeun hal anu sami upami anjeun nyusun Sass nganggo jalur pipa aset anjeun nyalira. Kami saacanna nganggo Node Sass pikeun Bootstrap v4, tapi LibSass sareng bungkusan anu diwangun di luhurna, kalebet Node Sass, ayeuna tos dileungitkeun .

Dart Sass ngagunakeun precision rounding 10 jeung alesan efisiensi teu ngidinan adjustment tina nilai ieu. Kami henteu nurunkeun katepatan ieu salami ngolah CSS anu kami hasilkeun, sapertos nalika minifikasi, tapi upami anjeun milih ngalakukeun éta, kami nyarankeun ngajaga akurasi sahenteuna 6 pikeun nyegah masalah sareng rounding browser.

Autoprefixer

Bootstrap ngagunakeun Autoprefixer (kaasup dina prosés ngawangun kami) pikeun otomatis nambahkeun awalan vendor kana sababaraha sipat CSS dina waktu ngawangun. Ngalakukeun kitu ngahemat waktos sareng kode kami ku ngamungkinkeun urang nyerat bagian konci CSS kami sakaligus bari ngaleungitkeun kabutuhan mixin vendor sapertos anu aya dina v3.

Kami ngajaga daptar browser anu dirojong ku Autoprefixer dina file anu misah dina gudang GitHub kami. Tempo .browserslistrc pikeun detil.

RTLCSS

Bootstrap nganggo RTLCSS pikeun ngolah CSS anu disusun sareng ngarobih kana RTL - dasarna ngagentos sipat sadar arah horizontal (misalna padding-left) sareng sabalikna. Hal ieu ngamungkinkeun urang ngan nulis CSS urang hiji waktu jeung nyieun tweaks minor ngagunakeun kontrol RTLCSS jeung diréktif nilai .

Dokuméntasi lokal

Ngajalankeun dokuméntasi kami sacara lokal ngabutuhkeun panggunaan Hugo, anu dipasang ku pakét npm hugo-bin . Hugo mangrupakeun generator situs statik blazingly gancang sarta cukup extensible nu nyadiakeun kami: dasar ngawengku, file basis Markdown, template, sarta leuwih. Ieu kumaha carana ngamimitian:

  1. Jalankeun setelan alat di luhur pikeun masang sadaya katergantungan.
  2. /bootstrapTina diréktori akar , jalankeun npm run docs-servedina garis paréntah.
  3. Buka http://localhost:9001/dina panyungsi anjeun, sarta voilà.

Diajar langkung seueur ngeunaan ngagunakeun Hugo ku maca dokuméntasina .

Pamérésan masalah

Upami anjeun ngalaman masalah sareng masang dependensi, cabut sadaya versi kagumantungan saméméhna (global sareng lokal). Lajeng, ngajalankeun deui npm install.