Cramnurbel

Cette page est en lecture seule. Vous pouvez afficher le texte source, mais ne pourrez pas le modifier. Contactez votre administrateur si vous pensez qu'il s'agit d'une erreur.

====== Téléchargement des sources et compilation dans VS Code ======

Tutoriel: [[https://www.youtube.com/watch?v=uc5Vt6-jeCg]]

Aller sur [[https://getbootstrap.com/docs/5.0/getting-started/download/]] et
télécharger les **sources**.

Décompresser l'archive dans un nouveau dossier et ouvrir ce dossier dans **VS Code**.

=> Utiliser l'extension **Live Sass Compiler**

{{:html_css:bootstrap5:screenshot_20210320_215337.png|}}

Structure du dossier :

<code>
/home/marc/mon_projet
├── bootstrap-5.0.2
│   ├── build
│   ├── dist
│   └── ...
├── index.html
└── style.scss
</code>

Fichier **index.html**

<code html>
<!DOCTYPE html>
<html lang="fr">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="style.css">
  <title>Test Bootstrap 5</title>
</head>
<body>
  
</body>
</html>
</code>

Fichier **style.scss**

<code css>
@import './bootstrap-5.0.2/scss/bootstrap.scss';
</code>

=> Le compilateur va inclure **bootstrap.scss** qui inclut lui-même tous les
autres fichiers scss de bootstrap. Le résultat se trouvera dans **style.css** et
contiendra tout Bootstrap ainsi que nos modifications et ajouts.

Cramnurbel

Outils pour utilisateurs

Outils du site

Outils de la page