Kontribuoni

Ndihmoni në zhvillimin e Bootstrap me skriptet dhe testet tona të ndërtimit të dokumentacionit.

Në këtë faqe

Vendosja e veglave

Bootstrap përdor skriptet npm për të ndërtuar dokumentacionin dhe për të përpiluar skedarët burimor. package.json ynë përmban këto skripta për përpilimin e kodit, ekzekutimin e testeve dhe më shumë. Këto nuk janë të destinuara për përdorim jashtë depove dhe dokumentacionit tonë.

Për të përdorur sistemin tonë të ndërtimit dhe për të ekzekutuar dokumentacionin tonë në nivel lokal, do t'ju duhet një kopje e skedarëve burimor të Bootstrap dhe Node. Ndiqni këto hapa dhe duhet të jeni gati të tundni:

Shkarkoni dhe instaloni Node.js , të cilin e përdorim për të menaxhuar varësitë tona.
Ose shkarkoni burimet e Bootstrap ose forconi depon e Bootstrap .
Navigoni te /bootstrapdirektoria rrënjësore dhe ekzekutoni npm installpër të instaluar varësitë tona lokale të listuara në package.json .

Kur të përfundoni, do të jeni në gjendje të ekzekutoni komandat e ndryshme të ofruara nga linja e komandës.

Përdorimi i skripteve npm

Paketa jonë.json përfshin detyra të shumta për zhvillimin e projektit. Ekzekutoni npm runpër të parë të gjitha skriptet npm në terminalin tuaj. Detyrat kryesore përfshijnë:

Detyrë	Përshkrim
`npm start`	Përpilon CSS dhe JavaScript, ndërton dokumentacionin dhe nis një server lokal.
`npm run dist`	Krijon `dist/`drejtorinë me skedarë të përpiluar. Kërkon Sass , Autoprefiksues dhe terser .
`npm test`	Kryen teste në nivel lokal pas vrapimit`npm run dist`
`npm run docs-serve`	Ndërton dhe ekzekuton dokumentacionin në nivel lokal.

Filloni me Bootstrap nëpërmjet npm me projektin tonë fillestar! Drejtohuni te depoja e shablloneve twbs/bootstrap-npm-starter për të parë se si të ndërtoni dhe personalizoni Bootstrap në projektin tuaj npm. Përfshin përpiluesin Sass, Autoprefiksuesin, Styleint, PurgeCSS dhe ikonat e Bootstrap.

Sass

Bootstrap përdor Dart Sass për përpilimin e skedarëve tanë burimor Sass në skedarët CSS (të përfshira në procesin tonë të ndërtimit) dhe ju rekomandojmë të bëni të njëjtën gjë nëse jeni duke përpiluar Sass duke përdorur linjën tuaj të aseteve. Ne kemi përdorur më parë Node Sass për Bootstrap v4, por LibSass dhe paketat e ndërtuara mbi të, duke përfshirë Node Sass, tani janë të vjetruara .

Dart Sass përdor një saktësi rrumbullakimi prej 10 dhe për arsye efikasiteti nuk lejon rregullimin e kësaj vlere. Ne nuk e ulim këtë saktësi gjatë përpunimit të mëtejshëm të CSS-së sonë të krijuar, si p.sh. gjatë minimit, por nëse vendosni ta bëni këtë, ju rekomandojmë të mbani një saktësi prej të paktën 6 për të parandaluar problemet me rrumbullakimin e shfletuesit.

Autoprefiksues

Bootstrap përdor Autoprefixer (përfshirë në procesin tonë të ndërtimit) për të shtuar automatikisht prefikset e shitësit në disa veti CSS në kohën e ndërtimit. Bërja e kësaj na kursen kohë dhe kod duke na lejuar të shkruajmë pjesë kyçe të CSS-së tonë një herë të vetme duke eliminuar nevojën për miks të shitësve si ato që gjenden në v3.

Ne e mbajmë listën e shfletuesve të mbështetur përmes Autoprefixer në një skedar të veçantë brenda depove tona të GitHub. Shihni .browserslistrc për detaje.

RTLCSS

Bootstrap përdor RTLCSS për të përpunuar CSS të përpiluara dhe për t'i kthyer ato në RTL - në thelb duke zëvendësuar vetitë e vetëdijshme për drejtimin horizontal (p.sh. padding-left) me të kundërtën e tyre. Na lejon të shkruajmë CSS-në tonë vetëm një herë dhe të bëjmë rregullime të vogla duke përdorur direktivat e kontrollit dhe vlerës së RTLCSS .

Dokumentacioni lokal

Ekzekutimi i dokumentacionit tonë në nivel lokal kërkon përdorimin e Hugo, i cili instalohet nëpërmjet paketës hugo-bin npm. Hugo është një gjenerues i faqeve statike jashtëzakonisht të shpejtë dhe mjaft të zgjerueshëm që na ofron: përfshirje bazë, skedarë të bazuar në Markdown, shabllone dhe më shumë. Ja se si ta filloni:

Kaloni përmes konfigurimit të veglave të mësipërme për të instaluar të gjitha varësitë.
Nga direktoria rrënjësore /bootstrap, ekzekutoni npm run docs-servenë vijën e komandës.
Hapeni http://localhost:9001/në shfletuesin tuaj dhe voilà.

Mësoni më shumë rreth përdorimit të Hugo duke lexuar dokumentacionin e tij .

Zgjidhja e problemeve

Nëse hasni probleme me instalimin e varësive, çinstaloni të gjitha versionet e mëparshme të varësisë (globale dhe lokale). Pastaj, riprodhoni npm install.