Gi
Ɛp fɔ divɛlɔp Bootstrap wit wi dɔkyumentri 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:
- Daunlod ɛn instɔl Node.js , we wi kin yuz fɔ manej wi dipɛnsin dɛn.
- Ɔ dawnlod Bootstrap in sɔs ɔ fɔk Bootstrap in ripɔsitɔri .
- Navigate to di rut
/bootstrap
dairektrɔ ɛn rɔnnpm install
fɔ 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 run
fɔ 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. I nid 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. |
Sass we 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 tɛm, bɔt LibSass ɛn pakej dɛn we dɛn bil pan am, inklud Node Sass, naw dɛn 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:
- Rɔn tru di tul sɛtup we de ɔp fɔ instɔl ɔl di dipɛnsin dɛn.
- Frɔm di rut
/bootstrap
dairektrɔ, rɔnnpm run docs-serve
na di kɔmand layn. - Opin
http://localhost:9001/
na yu brawza, ɛ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
.