in English

Tresnak eraiki

Ikasi Bootstrap-en barne npm scriptak nola erabiltzen gure dokumentazioa eraikitzeko, iturburu-kodea konpilatzeko, probak exekutatzeko eta abar.

Orrialde honetan

Tresneriaren konfigurazioa

Bootstrap- ek npm script -ak erabiltzen ditu bere eraikuntza-sistemarako. Gure package.json -ek markoarekin lan egiteko metodo erosoak biltzen ditu, besteak beste, kodea konpilatzea, probak egitea eta abar.

Gure eraikuntza-sistema erabiltzeko eta gure dokumentazioa lokalean exekutatzeko, Bootstrap-en iturburu-fitxategien eta Noderen kopia bat beharko duzu. Jarraitu urrats hauek eta rocka egiteko prest egon beharko zenuke:

Deskargatu eta instalatu Node.js , gure mendekotasunak kudeatzeko erabiltzen duguna.
Deskargatu Bootstrap-en iturburuak edo bideratu Bootstrap-en biltegia .
Joan erroko /bootstrapdirektoriora eta exekutatu package.jsonnpm install -en zerrendatutako gure menpekotasun lokalak instalatzeko .

Amaitutakoan, komando lerrotik emandako hainbat komando exekutatu ahal izango dituzu.

npm scriptak erabiliz

Gure package.json -ek proiektua garatzeko zeregin ugari biltzen ditu. Exekutatu npm runzure terminaleko npm script guztiak ikusteko. Lehen zereginak hauek dira:

Zeregin	Deskribapena
`npm start`	CSS eta JavaScript konpilatzen ditu, dokumentazioa eraikitzen du eta zerbitzari lokal bat abiarazten du.
`npm run dist`	`dist/`Konpilatutako fitxategiekin direktorioa sortzen du . Sass , Autoaurrizkia eta Terser behar ditu .
`npm test`	Exekutatu ondoren lokalean probak egiten ditu`npm run dist`
`npm run docs-serve`	Dokumentazioa lokalean eraiki eta exekutatzen du.

Hasi Bootstrap-ekin npm bidez gure hasierako proiektuarekin! Zoaz twbs /bootstrap-npm-starter txantiloien biltegira Bootstrap zure npm proiektuan nola eraiki eta pertsonalizatu ikusteko. Sass konpilatzailea, Autoprefixer, Stylelint, PurgeCSS eta Bootstrap ikonoak barne hartzen ditu.

Sass

Bootstrap- ek Dart Sass erabiltzen du gure Sass iturburu-fitxategiak CSS fitxategietan konpilatzeko (gure eraikuntza-prozesuan barne), eta gauza bera egitea gomendatzen dizugu Sass konpilatzen ari bazara zure aktibo kanalizazioa erabiliz. Aurretik Bootstrap v4rako Node Sass erabiltzen genuen, baina LibSass eta haren gainean eraikitako paketeak, Node Sass barne, zaharkituta daude .

Dart Sassek 10eko biribilketa-zehaztasuna erabiltzen du eta eraginkortasun arrazoiengatik ez du balio hori doitzen uzten. Ez dugu zehaztasun hori murrizten sortutako CSS gehiago prozesatzen direnean, hala nola txikitzean, baina hori aukeratzen baduzu, gutxienez 6ko zehaztasuna mantentzea gomendatzen dugu arakatzailearen biribilketarekin arazoak saihesteko.

Autoaurrizkia

Bootstrap- ek Autoprefixer erabiltzen du (gure eraikuntza-prozesuan barne) saltzaileen aurrizkiak CSS propietate batzuei automatikoki gehitzeko eraikitze-unean. Hori eginez gero, denbora eta kodea aurrezten gaitu, gure CSSaren funtsezko atalak aldi bakar batean idazteko aukera ematen digunez, v3-n aurkitutakoak bezalako hornitzaileen mixinen beharra ezabatuz.

Autoprefixer bidez onartzen diren arakatzaileen zerrenda aparteko fitxategi batean mantentzen dugu GitHub biltegiaren barruan. Ikus .browserslistrc xehetasunetarako.

RTLCSS

Bootstrap- ek RTLCSS erabiltzen du konpilatutako CSS prozesatzeko eta RTL bihurtzeko; funtsean, norabide horizontalaren jabe diren propietateak (adib. padding-left) kontrakoarekin ordezkatuz. Gure CSS behin bakarrik idazteko aukera ematen digu eta doikuntza txikiak egiteko RTLCSS kontrola eta balio - zuzentarauak erabiliz.

Tokiko dokumentazioa

Gure dokumentazioa lokalean exekutatzeak Hugo erabiltzea eskatzen du, hugo-bin npm paketearen bidez instalatzen dena . Hugo gune-sorgailu estatiko izugarri azkarra eta hedagarria da, eta eskaintzen diguna: oinarrizko barneak, Markdown-en oinarritutako fitxategiak, txantiloiak eta abar. Hona hemen nola hasteko:

Exekutatu goiko tresnaren konfigurazioa mendekotasun guztiak instalatzeko.
Erroko /bootstrapdirektoriotik, exekutatu npm run docs-servekomando lerroan.
Ireki http://localhost:9001/arakatzailean, eta listo.

Lortu informazio gehiago Hugo erabiltzeari buruzko dokumentazioa irakurrita .

Arazoak konpontzea

Mendekotasunak instalatzeko arazoak aurkitzen badituzu, desinstalatu aurreko mendekotasun bertsio guztiak (globalak eta lokalak). Ondoren, berriro exekutatu npm install.