symfony5:integration_bootstrap5_sass

Intégration de Bootstrap 5 (Sass)

Explications complètes sur la page Bootstrap 5

En résumé :

Télécharger les sources depuis https://getbootstrap.com/docs/5.0/getting-started/download/
Les décompresser dans le dossier public/css/bootstrap-5.x.x du projet
Créer un fichier public/css/style.scss dans lequel on importe bootstrap.scss
L'extension Live Sass Compiler de VSCode se chargera de créer un gros fichier style.css contenant Bootstrap + notre propre CSS.

@import './bootstrap-5.0.0-beta2/scss/bootstrap.scss';
@import /* (autres fichiers scss) */;

Et dans le template de base, on intègre juste le fichier style.css résultant de la compilation :

templates/base.html.twig

<!DOCTYPE html>
<html lang="fr">
    <head>
        ...
        <link rel="stylesheet" href="{{ asset('css/style.css') }}" />
    </head>
    ....
</html>

symfony5/integration_bootstrap5_sass.txt · Dernière modification: 2021/04/18 08:19 par marclebrun