Tools bauen
Léiert wéi Dir Bootstrap's abegraff npm Scripte benotzt fir eis Dokumentatioun ze bauen, Quellcode ze kompiléieren, Tester auszeféieren, a méi.
Tooling Setup
Bootstrap benotzt npm Scripte fir säi Build System. Eis package.json enthält praktesch Methoden fir mam Kader ze schaffen, inklusiv Kompiléierungscode, Lafen Tester, a méi.
Fir eise Build System ze benotzen an eis Dokumentatioun lokal auszeféieren, braucht Dir eng Kopie vun de Bootstrap Quelldateien an Node. Follegt dës Schrëtt an Dir sollt prett sinn ze rocken:
- Eroflueden an installéieren Node.js , déi mir benotze fir eis Ofhängegkeeten ze managen.
- Entweder luet d'Bootstrap Quellen erof oder fork Bootstrap's Repository .
- Navigéiert an de Root
/bootstrap
-Verzeichnis a lafennpm install
fir eis lokal Ofhängegkeeten ze installéieren, déi an package.json opgezielt sinn .
Wann Dir fäerdeg sidd, kënnt Dir déi verschidde Kommandoen aus der Kommandozeil ausféieren.
Benotzt npm Scripten
Eis package.json enthält déi folgend Kommandoen an Aufgaben:
Aufgab | Beschreiwung |
---|---|
npm run dist |
npm run dist erstellt den /dist/ Dossier mat kompiléierten Dateien. Benotzt Sass , Autoprefixer , an Terser . |
npm test |
Leeft Tester lokal no Lafennpm run dist |
npm run docs-serve |
Baut a leeft d'Dokumentatioun lokal. |
Run npm run
fir all npm Scripten ze gesinn.
Sass
Bootstrap v4 benotzt Node Sass fir eis Sass Quelldateien an CSS Dateien ze kompiléieren (an eisem Bauprozess abegraff). Fir mam selwechten generéierten CSS opzehalen wann Dir Sass mat Ärer eegener Asset Pipeline kompiléiert, musst Dir e Sass Compiler benotzen deen op d'mannst d'Features ënnerstëtzt déi Node Sass mécht. Dëst ass wichteg ze notéieren well ab dem 26. Oktober 2020 LibSass a Packagen drop gebaut ginn - inklusiv Node Sass - ofgeschaaft ginn .
Wann Dir méi nei Sass Features oder Kompatibilitéit mat méi nei CSS Standards erfuerdert, ass Dart Sass elo déi primär Implementatioun vu Sass an ënnerstëtzt eng JavaScript API déi komplett kompatibel ass mat Node Sass (mat e puer Ausnahmen, déi op Dart Sass GitHub Säit opgezielt sinn ).
Mir erhéijen d'Sass Ronn Präzisioun op 6 (par défaut ass et 5 am Node Sass) fir Probleemer mat Browser-Ronn ze vermeiden. Wann Dir Dart Sass benotzt, wäert dat net eppes sinn wat Dir musst upassen, well dee Compiler eng Ronn Präzisioun vun 10 benotzt an aus Effizienzgrënn net erlaabt datt se ugepasst ginn.
Autoprefixer
Bootstrap benotzt Autoprefixer (abegraff an eisem Build-Prozess) fir automatesch Verkeefer Präfixe fir e puer CSS-Eegeschafte bei der Bauzäit ze addéieren. Dat ze maachen spuert eis Zäit a Code andeems mir eis Schlësseldeeler vun eisem CSS eng eenzeg Kéier schreiwen, wärend de Besoin fir Verkeefermixins eliminéiert wéi déi am v3 fonnt ginn.
Mir halen d'Lëscht vun de Browser ënnerstëtzt duerch Autoprefixer an enger separater Datei an eisem GitHub Repository. Gesinn .browserslistrc fir Detailer.
Lokal Dokumentatioun
Eis Dokumentatioun lokal ze lafen erfuerdert d'Benotzung vum Hugo, deen iwwer den Hugo-bin npm Package installéiert gëtt. Hugo ass e blazingly schnellen an zimlech erweiterbare statesche Site Generator deen eis ubitt: Basis enthält, Markdown-baséiert Dateien, Templates, a méi. Hei ass wéi et unzefänken:
- Run duerch den Tooling-Setup hei uewen fir all Ofhängegkeeten ze installéieren.
- Aus dem Root
/bootstrap
Verzeechnes, lafennpm run docs-serve
an der Kommandozeil. - Open
http://localhost:9001/
an Ärem Browser, a voilà.
Léiert méi iwwer d'Benotzung vum Hugo andeems Dir seng Dokumentatioun liest .
Troubleshooting
Sollt Dir Problemer mat der Installatioun vun Ofhängegkeeten begéinen, deinstalléiert all fréier Ofhängegkeetsversioune (global a lokal). Dann, widderhuelen npm install
.