Krok 1: Instalacja Bootstrapa
Otwórz terminal w katalogu głównym Twojego projektu Angular i wykonaj poniższe polecenie, aby zainstalować Bootstrap przez npm (Node Package Manager):
npm install bootstrap
To polecenie pobierze i zainstaluje najnowszą wersję Bootstrapa w Twoim projekcie, dodając ją do folderu node_modules
oraz wpisując jako zależność w pliku package.json
.
Krok 2: Dodanie plików stylów Bootstrapa do projektu
Po zainstalowaniu Bootstrapa musisz dołączyć jego arkusz stylów do Twojego projektu Angular, aby móc z niego korzystać. Istnieją dwa główne sposoby, aby to zrobić:
Opcja 1: Dodaj do pliku angular.json
Otwórz plik angular.json
znajdujący się w katalogu głównym Twojego projektu i znajdź sekcję "styles"
. Następnie dodaj ścieżkę do arkusza stylów Bootstrapa:
"styles": [
"src/styles.css",
"node_modules/bootstrap/dist/css/bootstrap.min.css"
],
Dodanie tej ścieżki spowoduje, że Angular CLI automatycznie dołączy styl Bootstrapa podczas budowania aplikacji.
Aby dodać Bootstrap JavaScript do projektu Angular, musisz zaktualizować plik angular.json
w następujący sposób:
"scripts": [
"node_modules/bootstrap/dist/js/bootstrap.min.js"
],