in English

Bati zouti

Aprann kijan pou itilize script npm Bootstrap yo pou konstwi dokiman nou yo, konpile kòd sous, fè tès yo, ak plis ankò.

Konfigirasyon zouti

Bootstrap itilize scripts npm pou sistèm bati li yo. Package.json nou an gen ladan metòd pratik pou travay ak kad la, tankou konpile kòd, fè tès, ak plis ankò.

Pou itilize sistèm konstriksyon nou an epi kouri dokiman nou an lokalman, w ap bezwen yon kopi dosye sous Bootstrap ak Node. Swiv etap sa yo epi ou ta dwe pare pou rock:

  1. Telechaje epi enstale Node.js , ke nou itilize pou jere depandans nou yo.
  2. Swa telechaje sous Bootstrap oswa fouchèt depo Bootstrap la .
  3. /bootstrapNavige nan anyè rasin lan epi kouri npm installenstale depandans lokal nou yo ki nan lis nan package.json .

Lè w fini, ou pral kapab kouri kòmandman divès kalite yo bay nan liy lòd la.

Sèvi ak scripts npm

Package.json nou an gen ladan kòmandman ak travay sa yo:

Travay Deskripsyon
npm run dist npm run distkreye /dist/anyè a ak dosye konpile. Itilize Sass , Autoprefixer , ak terser .
npm test Kouri tès lokalman apre kourinpm run dist
npm run docs-serve Bati ak kouri dokiman an lokalman.

Kouri npm runpou wè tout scripts npm yo.

Kòmanse ak Bootstrap atravè npm ak pwojè starter nou an! Ale nan depo modèl twbs/bootstrap-npm-starter pou wè ki jan yo bati ak Customize Bootstrap nan pwòp pwojè npm ou. Gen ladann Sass du, Autoprefixer, Stylelint, PurgeCSS, ak Bootstrap Icons.

Sass

Bootstrap v4 itilize Node Sass pou konpile fichye sous Sass nou yo nan dosye CSS (ki enkli nan pwosesis konstriksyon nou an). Yo nan lòd yo fini ak menm CSS pwodwi a lè konpile Sass lè l sèvi avèk pwòp tiyo avantaj ou, ou pral bezwen sèvi ak yon du Sass ki sipòte omwen karakteristik yo ke Node Sass fè. Sa a enpòtan pou sonje paske apati 26 oktòb 2020, LibSass ak pakè ki te bati sou li—ki gen ladan Node Sass—yo demode .

Si ou bezwen nouvo karakteristik Sass oswa konpatibilite ak nouvo estanda CSS, Dart Sass se kounye a aplikasyon prensipal Sass epi li sipòte yon API JavaScript ki konplètman konpatib ak Node Sass (ak kèk eksepsyon ki nan lis paj GitHub Dart Sass la ).

Nou ogmante presizyon awondi Sass a 6 (pa default, li nan 5 nan Node Sass) pou anpeche pwoblèm ak awondi navigatè. Si w itilize Dart Sass, sa p ap yon bagay ou bezwen ajiste, paske konpilatè sa a sèvi ak yon presizyon awondi 10 epi pou rezon efikasite pa pèmèt li ajiste.

Otoprefiksè

Bootstrap itilize Autoprefixer (ki enkli nan pwosesis konstriksyon nou an) pou ajoute otomatikman prefiks machann nan kèk pwopriyete CSS nan moman konstriksyon. Lè w fè sa, sa fè nou sove tan ak kòd lè nou pèmèt nou ekri pati kle nan CSS nou an yon sèl fwa pandan w ap elimine nesesite pou mixin machann tankou sa yo jwenn nan v3.

Nou kenbe lis navigatè yo sipòte atravè Autoprefixer nan yon dosye separe nan depo GitHub nou an. Gade .browserslistrc pou plis detay.

Dokiman lokal yo

Kouri dokimantasyon nou an lokalman mande pou itilize Hugo, ki vin enstale atravè pake a hugo-bin npm. Hugo se yon dèlko sit estatik rapidman ak byen ekstansibl ki bay nou: enkli debaz, dosye ki baze sou Markdown, modèl, ak plis ankò. Men ki jan yo kòmanse li:

  1. Kouri nan konfigirasyon zouti ki anwo a pou enstale tout depandans.
  2. /bootstrapSoti nan anyè rasin lan , kouri npm run docs-servenan liy lòd la.
  3. Louvri http://localhost:9001/nan navigatè ou a, epi vwala.

Aprann plis sou itilizasyon Hugo lè w li dokiman li yo .

Depanaj

Si w ta rankontre pwoblèm ak enstale depandans, dezenstale tout vèsyon depandans anvan yo (global ak lokal). Lè sa a, rekòmanse npm install.