Source

Werkzeuge bauen

Erfahren Sie, wie Sie die enthaltenen npm-Skripte von Bootstrap verwenden, um unsere Dokumentation zu erstellen, Quellcode zu kompilieren, Tests auszuführen und vieles mehr.

Werkzeugaufbau

Bootstrap verwendet NPM-Skripte für sein Build-System. Unsere package.json enthält praktische Methoden zum Arbeiten mit dem Framework, einschließlich Kompilieren von Code, Ausführen von Tests und mehr.

Um unser Build-System zu verwenden und unsere Dokumentation lokal auszuführen, benötigen Sie eine Kopie der Quelldateien von Bootstrap und Node. Befolgen Sie diese Schritte und Sie sollten bereit sein zu rocken:

  1. Laden Sie Node.js herunter und installieren Sie es, mit dem wir unsere Abhängigkeiten verwalten.
  2. Navigieren Sie zum Stammverzeichnis /bootstrapund führen Sie es aus, um unsere in package.jsonnpm install aufgelisteten lokalen Abhängigkeiten zu installieren .
  3. Installieren Sie Ruby , installieren Sie Bundler mit gem install bundlerund führen Sie es schließlich aus bundle install. Dadurch werden alle Ruby-Abhängigkeiten wie Jekyll und Plugins installiert.
    • Windows-Benutzer: Lesen Sie diese Anleitung , um Jekyll problemlos zum Laufen zu bringen.

Wenn Sie fertig sind, können Sie die verschiedenen bereitgestellten Befehle über die Befehlszeile ausführen.

Verwenden von NPM-Skripten

Unsere package.json enthält die folgenden Befehle und Aufgaben:

Aufgabe Beschreibung
npm run dist npm run disterstellt das /distVerzeichnis mit kompilierten Dateien. Verwendet Sass , Autoprefixer und UglifyJS .
npm test Dasselbe wie npm run distplus es führt Tests lokal aus
npm run docs Erstellt und lint CSS und JavaScript für Dokumente. Sie können die Dokumentation dann lokal über ausführen npm run docs-serve.

Ausführen npm run, um alle npm-Skripte anzuzeigen.

Autoprefixer

Bootstrap verwendet Autoprefixer (in unserem Build-Prozess enthalten), um einigen CSS-Eigenschaften zur Build-Zeit automatisch Herstellerpräfixe hinzuzufügen. Auf diese Weise sparen wir Zeit und Code, da wir wichtige Teile unseres CSS einmal schreiben können, während wir die Notwendigkeit von Anbieter-Mixins wie denen in v3 eliminieren.

Wir pflegen die Liste der durch Autoprefixer unterstützten Browser in einer separaten Datei in unserem GitHub-Repository. Siehe /.browserslistrc für Details.

Lokale Dokumentation

Die lokale Ausführung unserer Dokumentation erfordert die Verwendung von Jekyll, einem anständig flexiblen statischen Site-Generator, der uns Folgendes bietet: grundlegende Includes, Markdown-basierte Dateien, Vorlagen und mehr. So fangen Sie an:

  1. Führen Sie das obige Tooling-Setup durch , um Jekyll (den Site-Builder) und andere Ruby-Abhängigkeiten mit bundle install.
  2. /bootstrapFühren Sie im Stammverzeichnis npm run docs-servedie Befehlszeile aus.
  3. Öffnen http://localhost:9001Sie in Ihrem Browser und voilà.

Erfahren Sie mehr über die Verwendung von Jekyll, indem Sie dessen Dokumentation lesen .

Fehlerbehebung

Sollten beim Installieren von Abhängigkeiten Probleme auftreten, deinstallieren Sie alle vorherigen Abhängigkeitsversionen (global und lokal). Führen Sie dann erneut aus npm install.