Многие компоненты Bootstrap используют файл JavaScript (записанный с использованием jQuery) с именем bootstrap.js или bootstrap.min.js. Этот файл используется для запуска анимации и эффектов, которые заставляют работать определенные c компоненты (например, карусель).
Если вы просто хотите адаптивную веб-страницу, которая не использует эти компоненты, то вы можете просто включите обычный CSS файл bootstrap.min.css или bootstrap.css и используйте предоставленные классы, которые заставляют работать макет.
Если вы загрузили веб-шаблон от третьей стороны, то, вероятно, они создали один файл main.js, который включает в себя часть кода Bootstrap JS и, возможно, некоторые другие настройки. Вот почему вы видите так много файлов, связанных в index.html. Проблема загрузки сторонних шаблонов заключается в том, что большую часть времени вы не знаете, какие настройки или изменения произошли. В результате, за проектом сложно следить и отлаживать.
Если вы новичок, возможно, стоит начать с официальных документов, а затем работать над этим.
Подробнее о Bootstrap JS компонентах здесь
Пример минимального Bootstrap кода интеграции:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap Minimal Example</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<div class="container">
<!-- more bootstrap structure goes here -->
</div>
</body>
</html>
Пример завершен Bootstrap код интеграции:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap Complete Example</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<div class="container">
<!-- more bootstrap structure goes here -->
</div>
<script src="js/jquery-3.4.1.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
Примечание. В примерах предполагается, что необходимые файлы загружаются локально в соответствующие папки js и css вашего проекта. Кроме того, popper.js является необходимой зависимостью для включения подсказок.