Installer Bootstrap dans Angular

Nous allons vous présenter comment installer et utiliser Bootstrap dans Angular.

Installer Bootstrap dans Angular

Bootstrap est un framework CSS utilisé pour concevoir rapidement un site Web réactif et adapté aux mobiles. C’est le cadre le plus populaire largement utilisé.

Nous pouvons également installer Bootstrap dans notre application Angular en suivant ces étapes simples et faciles. Pour créer une nouvelle application Angular, nous allons faire la commande ci-dessous dans le terminal.

# Terminal
ng new my-app
cd my-app

La commande ci-dessus crée un nouveau projet Angular et nous emmène dans le répertoire du projet my-app.

Nous devons maintenant installer Bootstrap dans notre projet Angular, et pour ce faire, nous devons accéder au terminal et exécuter la commande suivante.

# cli
npm install bootstrap --save

Cette commande installera le Bootstrap dans notre projet Angular. Mais si vous utilisez SASS dans votre projet, installez plutôt bootstrap-sass.

# cli
npm install bootstrap-sass --save

Une fois que vous avez installé Bootstrap, il sera enregistré dans les modules de nœuds, et maintenant nous n’avons plus qu’à importer Bootstrap CSS partout où nous voulons utiliser Bootstrap en utilisant les commandes d’importation suivantes.

# angular
@import '~bootstrap/dist/css/bootstrap.css';

Ou si vous utilisez SASS.

# angular
$icon-font-path: '~bootstrap-sass/assets/fonts/bootstrap/';
@import '~bootstrap-sass/assets/stylesheets/bootstrap';

Nous pouvons facilement installer Bootstrap dans nos applications Angular et les rendre réactifs et adaptés aux mobiles en utilisant les classes Bootstrap en suivant ces étapes simples.