Skip to di men tin dɛn we de insay Skip to doks nevigishɔn
Check

Ɛp fɔ divɛlɔp Bootstrap wit wi dɔkyumentri fɔ bil skript ɛn tɛst dɛn.

Sɛtup fɔ tul dɛn

Bootstrap de yuz npm skript fɔ bil di dɔkyumentri ɛn kɔmpilayt sɔs fayl dɛn. Wi package.json gɛt dɛn skript ya fɔ kɔmpilayt kɔd, fɔ rɔn tɛst, ɛn ɔda tin dɛn. Dɛn nɔ mek dɛn tin ya fɔ yuz ausayd wi ripɔsitɔri ɛn dɔkyumɛnt dɛn.

Fɔ yuz wi bild sistem ɛn rɔn wi dɔkyumentri lokal wan, yu go nid wan kɔpi fɔ Bootstrap in sɔs fayl dɛn ɛn Node. Fɔ fala dɛn step ya ɛn yu fɔ rɛdi fɔ rɔk:

  1. Daunlod ɛn instɔl Node.js , we wi kin yuz fɔ manej wi dipɛnsin dɛn.
  2. Ɔ dawnlod Bootstrap in sɔs ɔ fɔk Bootstrap in ripɔsitɔri .
  3. Navigate to di rut /bootstrapdairektrɔ ɛn rɔn npm installfɔ instɔl wi lokal dipɛnsin dɛn we de na package.json .

We yu dɔn, yu go ebul fɔ rɔn di difrɛn kɔmand dɛn we dɛn gi yu frɔm di kɔmand layn.

Yuz npm skript dɛn

Wi package.json inklud bɔku wok dɛn fɔ divɛlɔp di prɔjek. Rɔn npm runfɔ si ɔl di npm skript dɛn na yu tɛminal. Di men wok dɛn we dɛn fɔ du na:

Wok Tɔk bɔt
npm start Kɔmpayl CSS ɛn JavaSkript, bil di dɔkyumentri, ɛn stat wan lokal sava.
npm run dist Krio di dist/dairektrɔ wit fayl dɛn we dɛn dɔn kɔmpilayt. Yuz Sass , Ɔtoprɛfiksa , ɛn terser .
npm test Rɔn tɛst dɛn lokal wan afta i dɔn rɔnnpm run dist
npm run docs-serve Bil ɛn rɔn di dɔkyumentri lokal wan.
Get stat wit Bootstrap via npm wit wi stata projek! Hed to di twbs/bootstrap-npm-starter tɛmplat ripɔsitɔri fɔ si aw fɔ bil ɛn kɔstɔmayz Bootstrap na yu yon npm projɛkt. Inklud Sass kɔmpayla, Ɔtoprɛfiksa, Stayllint, PurgeCSS, ɛn Bootstrap Aykɔn dɛn.

Sass bin de

Bootstrap de yuz Dart Sass fɔ kɔmpilayt wi Sass sɔs fayl dɛn insay CSS fayl dɛn (we de insay wi bil prɔses), ɛn wi kin advays yu fɔ du di sem tin if yu de kɔmpilayt Sass yuz yu yon ɛset paip layn. Wi bin de yuz Node Sass fɔ Bootstrap v4 bifo, bɔt LibSass ɛn pakej dɛn we dɛn bil pan am, inklud Node Sass, naw dɛn de yuz am .

Dart Sass de yuz wan rawndin prɛsishɔn we na 10 ɛn fɔ efyushɔn rizin dɛn nɔ de alaw fɔ ajɔst dis valyu. Wi nɔ de put dis prɛsishɔn dɔŋ di tɛm we wi de prosɛs wi CSS we wi dɔn mek mɔ, lɛk di tɛm we dɛn de du am smɔl smɔl, bɔt if yu pik fɔ du dat wi kin advays yu fɔ kip di prɛsishɔn we na at le 6 fɔ mek yu nɔ gɛt prɔblɛm wit di brawza rawndin.

Ɔtoprɛfiksa

Bootstrap de yuz Autoprefixer (we de insay wi bil prɔses) fɔ ad vendor prɛfiks dɛn ɔtomɛtik wan to sɔm CSS prɔpati dɛn we dɛn de bil. We wi du dat, i de sev wi tɛm ɛn kɔd bay we i de alaw wi fɔ rayt di men pat dɛn na wi CSS wan tɛm we wi nɔ nid fɔ gɛt vendor mixins lɛk di wan dɛn we de na v3.

Wi de kip di list fɔ di brawza dɛn we dɛn sɔpɔt tru Autoprefixer insay wan sɛpret fayl insay wi GitHub ripɔsitɔri. Si .browserslistrc fɔ di ditel dɛn.

RTLCSS fɔ di wan dɛn we de wok

Bootstrap yuz RTLCSS fɔ prosɛs kɔmpilayt CSS ɛn kɔnvɔyt dɛn to RTL – besik wan riples ɔrizɔntal dairekshɔn aware prɔpati dɛn (ɛgz. padding-left) wit dɛn ɔpɔzit. I de alaw wi fɔ jɔs rayt wi CSS wan tɛm ɛn mek smɔl smɔl tweak dɛn we wi de yuz RTLCSS kɔntrol ɛn valyu dairekt.

Di lokal dɔkyumɛnt dɛn

Fɔ rɔn wi dɔkyumentri lokal wan nid fɔ yuz Hugo, we kin gɛt instɔleshɔn via di hugo-bin npm pakej. Hugo na wan blazingly fast ɛn kwik ɛkstensible statik sayt jenɛratɔ we de gi wi: besik inklud, Makdɔwn-bɛs fayl dɛn, tɛmplat dɛn, ɛn mɔ. Na dis na aw fɔ mek i bigin:

  1. Rɔn tru di tul sɛtup we de ɔp fɔ instɔl ɔl di dipɛnsin dɛn.
  2. Frɔm di rut /bootstrapdairektrɔ, rɔn npm run docs-servena di kɔmand layn.
  3. Opin http://localhost:9001/insay yu brɔwza, ɛn voilà.

Lan mɔ bɔt aw fɔ yuz Hugo bay we yu rid in dɔkyumɛnt dɛn .

Fɔ sɔlv prɔblɛm dɛn

If yu gɛt prɔblɛm wit fɔ instɔl dipɛnsin dɛn, ɔninstɔlɔ ɔl di dipɛnsin vɛshɔn dɛn we bin dɔn de bifo (global ɛn lokal). Dɔn, rirun npm install.