in English

Ibni għodod

Tgħallem kif tuża l-iskripts npm inklużi ta' Bootstrap biex tibni d-dokumentazzjoni tagħna, tikkumpila l-kodiċi tas-sors, tmexxi testijiet, u aktar.

Setup tal-għodda

Bootstrap juża skripts npm għas-sistema tal-bini tiegħu. Il- pakkett.json tagħna jinkludi metodi konvenjenti biex taħdem mal-qafas, inkluż il-kompilazzjoni tal-kodiċi, it-tmexxija tat-testijiet, u aktar.

Biex tuża s-sistema tal-bini tagħna u tħaddem id-dokumentazzjoni tagħna lokalment, ikollok bżonn kopja tal-fajls sors u Node ta' Bootstrap. Segwi dawn il-passi u inti għandek tkun lest biex rock:

  1. Niżżel u installa Node.js , li nużaw biex niġġestixxu d-dipendenzi tagħna.
  2. Jew niżżel is-sorsi ta' Bootstrap jew irażżel ir-repożitorju ta' Bootstrap .
  3. Innaviga lejn id-direttorju tal-għeruq /bootstrapu mexxi npm installbiex tinstalla d-dipendenzi lokali tagħna elenkati f'package.json .

Meta titlesta, tkun tista' tmexxi d-diversi kmandi pprovduti mil-linja tal-kmand.

Bl-użu ta 'skripts npm

package.json tagħna jinkludi l-kmandi u l-kompiti li ġejjin:

Kompitu Deskrizzjoni
npm run dist npm run distjoħloq id- /dist/direttorju b'fajls ikkumpilati. Juża Sass , Autoprefixer , u terser .
npm test Tmexxi testijiet lokalment wara li taħdemnpm run dist
npm run docs-serve Jibni u jmexxi d-dokumentazzjoni lokalment.

Mexxi npm runbiex tara l-iskripts kollha npm.

Ibda b'Bootstrap permezz ta' npm mal-proġett tal-bidu tagħna! Ras għar- repożitorju tal- mudelli twbs/bootstrap-npm-starter biex tara kif tibni u tippersonalizza Bootstrap fil-proġett npm tiegħek stess. Jinkludi kompilatur Sass, Autoprefixer, Stylelint, PurgeCSS, u Ikoni Bootstrap.

Sass

Bootstrap v4 juża Node Sass għall-kompilazzjoni tal-fajls tas-sors Sass tagħna f'fajls CSS (inklużi fil-proċess tal-bini tagħna). Sabiex tispiċċa bl-istess CSS iġġenerat meta tikkumpila Sass billi tuża l-pipeline tal-assi tiegħek stess, ikollok bżonn tuża kompilatur Sass li jappoġġa tal-inqas il-karatteristiċi li jagħmel Node Sass. Dan huwa importanti li wieħed jinnota għaliex mis-26 ta’ Ottubru 2020, LibSass u pakketti mibnija fuqu—inkluż Node Sass—huma deprecati .

Jekk teħtieġ karatteristiċi Sass aktar ġodda jew kompatibilità ma 'standards CSS aktar ġodda, Dart Sass issa huwa l-implimentazzjoni primarja ta' Sass u jappoġġja JavaScript API li hija kompletament kompatibbli ma 'Node Sass (bi ftit eċċezzjonijiet elenkati fuq il- paġna GitHub ta' Dart Sass ).

Aħna nżidu l-preċiżjoni tal-arrotondament tas-Sass għal 6 (b'mod awtomatiku, huwa 5 f'Node Sass) biex nipprevjenu problemi bl-arrotondament tal-browser. Jekk tuża Dart Sass din mhux se tkun xi ħaġa li għandek bżonn taġġusta, peress li dak il-kompilatur juża preċiżjoni tal-arrotondament ta '10 u għal raġunijiet ta' effiċjenza ma jippermettix li jiġi aġġustat.

Autoprefisser

Bootstrap juża Autoprefixer (inkluż fil-proċess tal-bini tagħna) biex iżid awtomatikament prefissi tal-bejjiegħ għal xi proprjetajiet CSS fil-ħin tal-bini. Jekk tagħmel hekk tiffranka ħin u kodiċi billi tippermettilna niktbu partijiet ewlenin tas-CSS tagħna darba waħda filwaqt li telimina l-ħtieġa għal mixins tal-bejjiegħ bħal dawk misjuba f'v3.

Aħna nżommu l-lista ta 'browsers appoġġjati permezz ta' Autoprefixer f'fajl separat fi ħdan ir-repożitorju GitHub tagħna. Ara .browserslistrc għad-dettalji.

Dokumentazzjoni lokali

It-tmexxija tad-dokumentazzjoni tagħna lokalment teħtieġ l-użu ta 'Hugo, li jiġi installat permezz tal- pakkett hugo-bin npm. Hugo huwa ġeneratur ta 'sit statiku blazingly veloċi u pjuttost estensibbli li jipprovdilna: jinkludi bażiku, fajls ibbażati fuq Markdown, mudelli, u aktar. Hawn kif tibda:

  1. Mexxi s- setup tal-għodda hawn fuq biex tinstalla d-dipendenzi kollha.
  2. Mid- /bootstrapdirettorju tal-għeruq, mexxi npm run docs-servefil-linja tal-kmand.
  3. Iftaħ http://localhost:9001/fil-browser tiegħek, u voilà.

Tgħallem aktar dwar l-użu ta' Hugo billi taqra d- dokumentazzjoni tiegħu .

Issolvi l-problemi

Jekk tiltaqa' ma' problemi bl-installazzjoni tad-dipendenzi, iddiżinstalla l-verżjonijiet tad-dipendenza preċedenti kollha (globali u lokali). Imbagħad, erġa' wettaq npm install.