Rach gu prìomh shusbaint Air adhart gu seòladh docs
Check
in English

Cur ris

Cuidich le bhith a’ leasachadh Bootstrap leis na sgrìobhainnean againn a’ togail sgriobtaichean agus deuchainnean.

Suidheachadh innealan

Bidh Bootstrap a’ cleachdadh sgriobtaichean npm gus na sgrìobhainnean a thogail agus faidhlichean stòr a chuir ri chèile. Anns a’ phacaid againn.json tha na sgriobtaichean sin airson còd a chuir ri chèile, deuchainnean a ruith, agus barrachd. Chan eilear an dùil an cleachdadh taobh a-muigh ar stòr-dàta agus ar sgrìobhainnean.

Gus an siostam togail againn a chleachdadh agus na sgrìobhainnean againn a ruith gu h-ionadail, bidh feum agad air leth-bhreac de fhaidhlichean stòr Bootstrap agus Node. Lean na ceumannan seo agus bu chòir dhut a bhith deiseil airson roc:

  1. Luchdaich sìos agus stàlaich Node.js , a bhios sinn a’ cleachdadh gus ar eisimeileachd a riaghladh.
  2. An dàrna cuid luchdaich sìos stòran Bootstrap no forc stòr Bootstrap .
  3. /bootstrapSeòl chun an eòlaire root agus ruith npm installgus na h-eisimeileachd ionadail againn a tha air an liostadh ann am package.json a stàladh .

Nuair a bhios tu deiseil, bidh e comasach dhut na diofar òrdughan a chaidh a sholarachadh bhon loidhne-àithne a ruith.

A’ cleachdadh sgriobtaichean npm

Tha ar pack.json a’ toirt a-steach grunn ghnìomhan airson a’ phròiseact a leasachadh. Ruith npm rungus na sgriobtaichean npm gu lèir fhaicinn anns a’ chrìoch agad. Am measg nan prìomh ghnìomhan tha:

Tasc Tuairisgeul
npm start A’ cur ri chèile CSS agus JavaScript, a’ togail na sgrìobhainnean, agus a’ tòiseachadh frithealaiche ionadail.
npm run dist Cruthaich an dist/eòlaire le faidhlichean cruinnichte. A’ cleachdadh Sass , Autoprefixer , agus terser .
npm test A’ ruith dheuchainnean gu h-ionadail às deidh ruithnpm run dist
npm run docs-serve Togail agus ruith na sgrìobhainnean gu h-ionadail.
Tòisich le Bootstrap tro npm leis a’ phròiseact tòiseachaidh againn! Rach gu stòr teamplaid twbs/bootstrap-npm-starter gus faicinn mar a thogas tu agus a ghnàthachadh Bootstrap anns a’ phròiseact npm agad fhèin. A’ toirt a-steach Sass compiler, Autoprefixer, Stylelint, PurgeCSS, agus Bootstrap Icons.

Sass

Bidh Bootstrap a’ cleachdadh Dart Sass airson na faidhlichean stòr Sass againn a chur ri chèile ann am faidhlichean CSS (air an gabhail a-steach sa phròiseas togail againn), agus tha sinn a’ moladh gun dèan thu an aon rud ma tha thu a’ cur ri chèile Sass a’ cleachdadh an loidhne-phìoban so-mhaoin agad fhèin. Chleachd sinn Node Sass airson Bootstrap v4 roimhe seo, ach tha LibSass agus pacaidean a chaidh a thogail air a bharr, a’ toirt a-steach Node Sass, a-nis gun samhail .

Bidh Dart Sass a’ cleachdadh mionaideachd cruinneachaidh de 10 agus airson adhbharan èifeachdais chan eil e a’ ceadachadh an luach seo atharrachadh. Cha bhith sinn a’ lughdachadh a’ chruinneas seo nuair a bhios sinn a’ giullachd an CSS a chaidh a chruthachadh tuilleadh, leithid aig àm mion-sgrùdadh, ach ma roghnaicheas tu sin a dhèanamh tha sinn a’ moladh cumail suas mionaideachd de 6 co-dhiù gus casg a chuir air cùisean le cruinneachadh brobhsair.

Ro-leasachan fèin-obrachail

Bidh Bootstrap a’ cleachdadh Autoprefixer (air a ghabhail a-steach sa phròiseas togail againn) gus ro-leasachain reiceadair a chuir gu fèin-ghluasadach gu cuid de thogalaichean CSS aig àm togail. Le bhith a’ dèanamh sin sàbhalaidh sin ùine agus còd dhuinn le bhith a’ leigeil leinn prìomh phàirtean den CSS againn a sgrìobhadh aon uair fhad ‘s a tha sinn a’ cur às don fheum air measgachadh reiceadair mar an fheadhainn a lorgar ann an v3.

Bidh sinn a’ cumail an liosta de bhrobhsairean le taic tro Autoprefixer ann am faidhle air leth taobh a-staigh ar stòr GitHub. Faic .browserslistrc airson mion-fhiosrachadh.

RTLCSS

Bidh Bootstrap a’ cleachdadh RTLCSS gus CSS cruinnichte a phròiseasadh agus an tionndadh gu RTL - gu bunaiteach a’ dol an àite thogalaichean a tha mothachail air taobh còmhnard (me padding-left) leis an fhear eile. Leigidh e leinn dìreach ar CSS a sgrìobhadh aon turas agus mion-atharrachaidhean a dhèanamh a’ cleachdadh stiùiridhean smachd is luach RTLCSS .

Sgrìobhainnean ionadail

Le bhith a’ ruith ar sgrìobhainnean gu h-ionadail feumar Hugo a chleachdadh, a thèid a chuir a-steach tron ​​​​phasgan hugo-bin npm. Tha Hugo na ghineadair làrach statach a tha gu math luath agus gu math leudachail a bheir dhuinn: bunaiteach a’ toirt a-steach, faidhlichean stèidhichte air Markdown, teamplaidean, agus barrachd. Seo mar a thòisicheas tu air:

  1. Ruith tron ​​​​t- suidheachadh innealan gu h-àrd gus a h-uile eisimeileachd a stàladh.
  2. /bootstrapBhon eòlaire root , ruith npm run docs-servesan loidhne-àithne.
  3. Fosgail http://localhost:9001/sa bhrobhsair agad, agus voilà.

Ionnsaich tuilleadh mu bhith a’ cleachdadh Hugo le bhith a’ leughadh na sgrìobhainnean aige .

Fuasgladh thrioblaidean

Ma thachras tu air duilgheadasan le stàladh eisimeileachd, dì-stàlaich a h-uile dreach eisimeileachd roimhe (cruinneil agus ionadail). An uairsin, ath-ruith npm install.