Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

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>​
 +
 +