Différences
Ci-dessous, les différences entre deux révisions de la page.
Prochaine révision | Révision précédente | ||
prog:symfony:extensions:bootstrap [11/09/2022 17:38] thierry créée |
prog:symfony:extensions:bootstrap [11/09/2022 19:43] (Version actuelle) thierry [Prérequis] |
||
---|---|---|---|
Ligne 3: | Ligne 3: | ||
* **node** doit etre installé sur le PC | * **node** doit etre installé sur le PC | ||
* le [[prog:symfony:extensions:webpack|bundle WebPack]] doit être installé dans le répertoire du projet. | * le [[prog:symfony:extensions:webpack|bundle WebPack]] doit être installé dans le répertoire du projet. | ||
+ | * [[prog:symfony:extensions:scss|Pouvoir travailler avec les fichier SCSS]]. | ||
+ | * [[prog:symfony:extensions:twig:twig|Le système de template TWIG doit être installé]]. | ||
+ | |||
+ | ===== Installation ===== | ||
+ | Comande : ''npm install bootstrap @popperjs/core bs-custom-file-input --dev'' | ||
+ | <code> | ||
+ | >npm install bootstrap @popperjs/core bs-custom-file-input --dev | ||
+ | npm WARN config dev Please use --include=dev instead. | ||
+ | |||
+ | added 3 packages, and audited 791 packages in 6s | ||
+ | |||
+ | 78 packages are looking for funding | ||
+ | run `npm fund` for details | ||
+ | |||
+ | found 0 vulnerabilities | ||
+ | </code> | ||
+ | ===== Modifications ===== | ||
+ | Modifier les fichiers ''app.scss'' et ''app.js'' | ||
+ | <code javascript assets\styles\app.scss> | ||
+ | @import '~bootstrap/scss/bootstrap'; | ||
+ | </code> | ||
+ | <code javascript assets\app.js> | ||
+ | import './styles/app.scss'; | ||
+ | import 'bootstrap'; | ||
+ | import bsCustomFileInput from 'bs-custom-file-input'; | ||
+ | bsCustomFileInput.init(); | ||
+ | |||
+ | </code> | ||
+ | <code yaml config\packages\twig.yaml> | ||
+ | twig: | ||
+ | form_themes: ['bootstrap_5_layout.html.twig'] | ||
+ | </code> | ||
+ | |||
+ | |||