Menu
I am currently working on Astro (astro.build) and would like to use it with the latest Bootstrap version.
Does anyone know about Astro and can please explain to me how to properly integrate Bootstrap?
Didn't find anything on the internet or here in the forum, at least there wasn't a clear answer.
Thank you very much!
348
asked Apr 20 '26 13:04
For npm/yarn:
index.astro
---
import "bootstrap/dist/css/bootstrap.min.css";
import bootstrap from "bootstrap/dist/js/bootstrap.bundle.min.js?url";
---
<html>
<script src={bootstrap}></script>
<!-- Your page here -->
</html>
I kept getting Typescript errors <script> uses an expression for the src attribute and will be ignored. and switched to Astro's suggested CSS and JS implementation using import.
# install via npm
npm install bootstrap@latest
and then use import in your .astro file
---
// Astro will bundle and optimize this automatically
import "bootstrap/dist/css/bootstrap.min.css";
---
<html>
<!-- Your page here -->
</html>
<script>
// Astro will bundle and process this automatically
import 'bootstrap/dist/js/bootstrap.bundle.min.js'
</script>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
