Symfony Asset Mapper is great, but is missing for some cookbooks. Even though its documentation is pretty clear. This is why I'm writting this little guide on how to install bootstrap with the new asset mapper of Symfony.
The following commands will install Bootstrap and make a link to the CSS.
bin/console importmap:require bootstrap
ℹ️ This command will also download PopperJS which is a dependency of Bootstrap. You may also notice in the importmap.php file that the CSS has been also installed, this is because Bootstrap explicitely present the CSS in its package configuration, not all packages will be automatically included like that.
To enable the Bootstrap style, you need to include the CSS in your JS file.
// assets/app.js
import 'bootstrap/dist/css/bootstrap.min.css';
Example on how to enable tooltips in JS:
import { Tooltip } from 'bootstrap'
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new Tooltip(tooltipTriggerEl))
And in your HTML:
<button class="btn btn-primary" data-bs-toggle="tooltip" data-bs-title="WOW Impressive!">I have a tooltip!</button>