Bootstrap in Angular installieren
Wir werden vorstellen, wie man Bootstrap in Angular installiert und verwendet.
Installieren Sie Bootstrap in Angular
Bootstrap
ist ein CSS-Framework, das verwendet wird, um schnell eine ansprechende und für Mobilgeräte optimierte Website zu entwerfen. Es ist das beliebteste Framework, das weit verbreitet ist.
Wir können Bootstrap auch in unserer Angular-Anwendung installieren, indem wir diesen einfachen und einfachen Schritten folgen. Um eine neue Angular-Anwendung zu erstellen, führen wir den folgenden Befehl im Terminal aus.
# Terminal
ng new my-app
cd my-app
Der obige Befehl erstellt ein neues Angular-Projekt und bringt uns in das Projektverzeichnis my-app
.
Jetzt müssen wir Bootstrap in unserem Angular-Projekt installieren, und dazu müssen wir zum Terminal gehen und den folgenden Befehl ausführen.
# cli
npm install bootstrap --save
Dieser Befehl installiert den Bootstrap in unserem Angular-Projekt. Wenn Sie jedoch SASS
in Ihrem Projekt verwenden, installieren Sie stattdessen bootstrap-sass
.
# cli
npm install bootstrap-sass --save
Sobald Sie Bootstrap installiert haben, wird es in Knotenmodulen gespeichert, und jetzt müssen wir nur noch Bootstrap CSS importieren, wo immer wir Bootstrap verwenden möchten, indem Sie die folgenden Importbefehle verwenden.
# angular
@import '~bootstrap/dist/css/bootstrap.css';
Oder wenn Sie SASS
verwenden.
# angular
$icon-font-path: '~bootstrap-sass/assets/fonts/bootstrap/';
@import '~bootstrap-sass/assets/stylesheets/bootstrap';
Wir können Bootstrap ganz einfach in unseren Angular-Anwendungen installieren und es durch die Verwendung von Bootstrap-Klassen reaktionsschnell und mobilfreundlich machen, indem Sie diesen einfachen Schritten folgen.
Rana is a computer science graduate passionate about helping people to build and diagnose scalable web application problems and problems developers face across the full-stack.
LinkedIn