Source

Szerszámok építése

Tanulja meg, hogyan használhatja a Bootstrap mellékelt npm szkriptjeit dokumentációnk felépítéséhez, forráskód fordításához, tesztek futtatásához és sok máshoz.

Szerszámozás beállítása

A Bootstrap npm szkripteket használ felépítési rendszeréhez. A package.json fájlunk kényelmes módszereket tartalmaz a keretrendszerrel való munkavégzéshez, beleértve a kódfordítást, a tesztek futtatását és még sok mást.

Összeállítási rendszerünk használatához és dokumentációnk helyi futtatásához szüksége lesz a Bootstrap forrásfájljainak és a Node-nak egy másolatára. Kövesse az alábbi lépéseket, és készen kell állnia a ringatásra:

  1. Töltse le és telepítse a Node.js fájlt , amelyet függőségeink kezelésére használunk.
  2. Keresse meg a gyökérkönyvtárat /bootstrap, és futtassa a package.json fájlbannpm install felsorolt ​​helyi függőségek telepítéséhez .
  3. Telepítse a Ruby -t , telepítse a Bundler -t a segítségével gem install bundler, és végül futtassa bundle install. Ezzel telepíti az összes Ruby-függőséget, például a Jekyll-t és a bővítményeket.
    • Windows-felhasználók: Olvassa el ezt az útmutatót a Jekyll problémamentes üzembe helyezéséhez.

Ha elkészült, futtathatja a különböző parancsokat a parancssorból.

npm szkriptek használata

A package.json fájlunk a következő parancsokat és feladatokat tartalmazza:

Feladat Leírás
npm run dist npm run distlétrehozza a /dist/könyvtárat a lefordított fájlokkal. Sass , Autoprefixer és UglifyJS - t használ .
npm test Ugyanúgy, mint npm run distplusz, helyi teszteket futtat
npm run docs CSS-t és JavaScriptet épít és szöszöl a dokumentumokhoz. Ezután a dokumentációt helyileg futtathatja a következőn keresztül npm run docs-serve.

Futtassa npm runaz összes npm szkript megtekintéséhez.

Autoprefixer

A Bootstrap Autoprefixer -t használ (amely benne van az összeállítási folyamatunkban), hogy automatikusan hozzáadja a szállítói előtagokat egyes CSS-tulajdonságokhoz az összeállítás során. Ezzel időt és kódot takaríthatunk meg, mivel lehetővé teszi számunkra, hogy a CSS kulcsfontosságú részeit egyetlen alkalommal írjuk meg, miközben szükségtelenné válik a 3-as verzióban található gyártói mixin.

Az Autoprefixeren keresztül támogatott böngészők listáját külön fájlban kezeljük a GitHub tárhelyünkön belül. A részletekért lásd a .browserslistrc fájlt .

Helyi dokumentáció

Dokumentációnk helyi futtatásához a Jekyll, egy kellően rugalmas statikus webhely-generátor használatára van szükség, amely biztosítja számunkra az alapvető elemeket, a Markdown-alapú fájlokat, sablonokat és egyebeket. Így kezdheti el:

  1. Futtassa végig a fenti eszközbeállítást a Jekyll (a webhelykészítő) és más Ruby-függőségek telepítéséhez a -val bundle install.
  2. A gyökérkönyvtárból /bootstrapfuttassa npm run docs-servea parancssorban.
  3. Nyissa http://localhost:9001meg a böngészőben, és íme.

Ha többet szeretne megtudni a Jekyll használatáról, olvassa el a dokumentációját .

Hibaelhárítás

Ha problémákat tapasztal a függőségek telepítése során, távolítsa el az összes korábbi függőségi verziót (globális és helyi). Ezután futtassa újra npm install.