it-swarm.com.de

Bootstrap 4 Custom Build Generator / Download

Kennt jemand einen Alpha/Beta bootstrap 4 benutzerdefinierten Generator, der auch für bootstrap 3 unter Anpassen und herunterladen verfügbar ist?

https://getbootstrap.com/docs/4.0/customize/ noch nicht verfügbar

20
Yatko

Wie bereits erwähnt hier , wird es keinen Customizer für Bootstrap 4. Dies bedeutet, dass Sie Build-Tools für sich selbst einrichten müssen. Dies ist mein Workflow ( in NodeJS):

  1. Erstelle ein neues Projekt mit npm init
  2. Installiere Bootstrap mit npm install bootstrap
  3. Installieren Sie die Build-Tools. Um dies zu vereinfachen und nur einen Befehl zu verwenden, verwenden wir scss-powertools ( Ich bin der Autor davon). Wenn Sie es nicht verwenden möchten, müssen Sie das Kompilieren, Präfixieren, Minimieren (und Flusen) selbst einrichten. Führen Sie aus: npm install scss-powertools --save-dev
  4. Erstellen Sie die SCSS-Datei in einem scss -Ordner (im Stammverzeichnis Ihres Projekts), z. B. scss/name.scss.
  5. Importieren Sie in der SCSS-Datei Bootstrap mit @import "bootstrap/scss/bootstrap"; Oder importieren Sie einzelne Komponenten nach Bedarf
  6. Füge ein neues Skript zu package.json Hinzu: "build": "scss-powertools scss/name.scss output/compiled.css"
  7. Führen Sie npm run build Aus. Sie finden Ihr kompiliertes CSS in output/compiled.css (Oder in einer anderen Option, die Sie im Befehl build angegeben haben).

Hinweis! scss-powertools Wird standardmäßig nicht minimiert. Verwenden Sie zum Aktivieren das Flag --production. Alle Informationen dazu finden Sie hier .

Einfaches Setup finden Sie unter Gist .


Sie finden meinen vorherigen Workflow hier . Darin musste ich alles von der Zusammenstellung bis zum Fusseln manuell einrichten.

13
Klooven

Gute Frage! Bootstrap 3 hatte, wie Sie bemerkt haben, eine Seite zum Anpassen.

Sie können dieses Build-Tool verwenden: https://bootstrap.build/ . Ich bin mir nicht sicher, ob es der Ersatz für die BS3-Anpassungsseite oder etwas Neues ist. Es sieht aus wie ein netter Editor.

Oder Sie können eine benutzerdefinierte Version von Bootstrap 4 mit SASS erstellen.

Dieser Link enthält weitere Informationen zum Erstellen eines Themas: https://getbootstrap.com/docs/4.0/getting-started/theming/

7
Jess

Es sieht nicht so aus, als würde das Bootstrap Team einen Customizer wie in v3 anbieten.

Wie in anderen Antworten erwähnt, ist bootstrap.build vorhanden, hat eine sehr schöne Benutzeroberfläche und bietet Zugriff auf die meisten Variablen und Optionen. Leider scheint es nicht so schnell aktualisiert zu werden, wie das Bootstrap Team Updates veröffentlicht.

pgrade-bootstrap.bootply.com ist eine weitere Option, gibt jedoch keinen Hinweis darauf, welche Version von v4 verwendet wird. Es hat nur eingeschränkten Zugriff auf Variablen und Optionen.

bootstrapcustomizer.com bietet uneingeschränkten Zugriff auf alle Variablen und Optionen und wird mit den Releases von Version 4 auf dem neuesten Stand gehalten. Es ist nicht so schön eine Benutzeroberfläche wie bootstrap.build, aber es funktioniert.

(Offenlegung: Ich habe bootstrapcustomizer.com erstellt.)

6
johna