in English

Bouwe ark

Learje hoe't jo de ynbegrepen npm-skripts fan Bootstrap brûke om ús dokumintaasje te bouwen, boarnekoade te kompilearjen, tests út te fieren, en mear.

Op dizze side

Tooling opset

Bootstrap brûkt npm-skripts foar har buildsysteem. Us package.json omfettet handige metoaden foar it wurkjen mei it ramt, ynklusyf it kompilearjen fan koade, it útfieren fan tests, en mear.

Om ús buildsysteem te brûken en ús dokumintaasje lokaal út te fieren, hawwe jo in kopy fan Bootstrap's boarnebestannen en Node nedich. Folgje dizze stappen en jo moatte ree wêze om te rocken:

Download en ynstallearje Node.js , dy't wy brûke om ús ôfhinklikens te behearjen.
Of download Bootstrap's boarnen of fork Bootstrap's repository .
Navigearje nei de root- /bootstrapmap en rinne npm installom ús lokale ôfhinklikens te ynstallearjen neamd yn package.json .

As jo foltôge binne, kinne jo de ferskate kommando's útfiere fan 'e kommandorigel.

It brûken fan npm-skripts

Us package.json omfettet tal fan taken foar it ûntwikkeljen fan it projekt. Rinne npm runom alle npm-skripts yn jo terminal te sjen. Primêre taken omfetsje:

Taak	Beskriuwing
`npm start`	Kompileart CSS en JavaScript, bout de dokumintaasje en begjint in lokale server.
`npm run dist`	Meitsje de `dist/`map mei kompilearre bestannen. Fereasket Sass , Autoprefixer , en terser .
`npm test`	Rint tests lokaal nei it rinnen`npm run dist`
`npm run docs-serve`	Bout en rint de dokumintaasje lokaal.

Begjin mei Bootstrap fia npm mei ús startersprojekt! Gean nei it twbs/bootstrap-npm-starter template repository om te sjen hoe't jo Bootstrap kinne bouwe en oanpasse yn jo eigen npm-projekt. Omfettet Sass-kompiler, Autoprefixer, Stylelint, PurgeCSS, en Bootstrap-ikoanen.

Sass

Bootstrap brûkt Dart Sass foar it kompilearjen fan ús Sass-boarnebestannen yn CSS-bestannen (ynklusyf yn ús bouproses), en wy riede oan dat jo itselde dwaan as jo Sass kompilearje mei jo eigen assetpipeline. Wy brûkten earder Node Sass foar Bootstrap v4, mar LibSass en pakketten dy't derop boud binne, ynklusyf Node Sass, binne no ôfret .

Dart Sass brûkt in ôfrûning presyzje fan 10 en foar effisjinsje redenen net tastean oanpassing fan dizze wearde. Wy ferleegje dizze krektens net by fierdere ferwurking fan ús oanmakke CSS, lykas by minifikaasje, mar as jo derfoar keazen hawwe, riede wy oan om in presyzje fan op syn minst 6 te behâlden om problemen mei browserôfrûning foar te kommen.

Autoprefixer

Bootstrap brûkt Autoprefixer (ynklusyf yn ús bouproses) om ferkeaperfoarheaksels automatysk ta te foegjen oan guon CSS-eigenskippen yn 'e boutiid. Troch dit te dwaan besparret ús tiid en koade troch ús te tastean wichtige dielen fan ús CSS ien kear te skriuwen, wylst de needsaak foar ferkeapermixins lykas dy fûn yn v3 elimineare.

Wy ûnderhâlde de list mei browsers dy't wurde stipe troch Autoprefixer yn in apart bestân binnen ús GitHub-repository. Sjoch .browserslistrc foar details.

RTLCSS

Bootstrap brûkt RTLCSS om kompilearre CSS te ferwurkjen en te konvertearjen nei RTL - yn prinsipe ferfangt horizontale rjochtingsbewuste eigenskippen (bgl. padding-left) mei har tsjinoerstelde. It lit ús ús CSS mar ien kear skriuwe en lytse tweaks meitsje mei RTLCSS -kontrôle en wearderjochtlinen .

Lokale dokumintaasje

It útfieren fan ús dokumintaasje lokaal fereasket it gebrûk fan Hugo, dat wurdt ynstalleare fia it hugo-bin npm-pakket. Hugo is in razendsnelle en frij útbreidbere statyske sidegenerator dy't ús leveret: basis omfettet, Markdown-basearre bestannen, sjabloanen, en mear. Hjir is hoe't jo it begjinne kinne:

Rinne troch de tooling-opset hjirboppe om alle ôfhinklikens te ynstallearjen.
Fanút de root- /bootstrapmap, rinne npm run docs-serveyn 'e kommandorigel.
Iepenje http://localhost:9001/yn jo blêder, en voilà.

Learje mear oer it brûken fan Hugo troch de dokumintaasje te lêzen .

Problemen oplosse

Mochten jo problemen tsjinkomme mei it ynstallearjen fan ôfhinklikens, ferwiderje dan alle eardere ôfhinklikensferzjes (globaal en lokaal). Dan, werhelje npm install.