安装 Bootstrap Laravel 8

简介

本教程将向您介绍如何在 Laravel 8 中安装和配置 Bootstrap。Bootstrap 是一个流行的前端框架，可以帮助您轻松构建现代化的网站和应用程序。

步骤

步骤 1: 创建 Laravel 8 项目

首先，您需要创建一个 Laravel 8 项目。在命令行中执行以下命令：

laravel new myproject
cd myproject

这将使用 Laravel 8 的默认模板创建一个名为 myproject 的项目，并进入该项目目录。

步骤 2: 安装 Bootstrap

在 Laravel 8 项目中，您可以使用 Composer 包管理器来安装 Bootstrap。在命令行中执行以下命令：

composer require laravel/ui

这将安装 Laravel UI Composer 包，该包允许您快速安装 Bootstrap、Vue 和 React。

步骤 3: 安装 Bootstrap 前端资源

运行以下命令来生成 Laravel 8 中所需的 Bootstrap 前端资源：

php artisan ui bootstrap

这将使用 Laravel UI 来生成 Bootstrap 的前端资源，包括样式表和 JavaScript 文件。

步骤 4: 编译前端资源

在 Laravel 8 中，您需要运行 Mix 编译器来编译前端资源。Mix 是 Laravel 的前端工具链，用于编译 Sass、Less 和 JavaScript 文件。

运行以下命令来编译前端资源：

npm install
npm run dev

这将安装所有必要的前端依赖项，并将资源编译到 public 目录中。

步骤 5: 引入 Bootstrap

现在，您可以在 Laravel 8 项目中使用 Bootstrap 了。打开 resources/views/welcome.blade.php 文件，并在 head 标签内添加以下行：

<link href="{{ asset('css/app.css') }}" rel="stylesheet">

这将在您的应用程序中引入 Bootstrap 的样式表。

在 body 标签内，您还可以根据需要添加以下行来加载 Bootstrap 的 JavaScript 文件：

<script src="{{ asset('js/app.js') }}"></script>

步骤 6: 运行应用程序

现在，您可以运行您的 Laravel 8 应用程序，以查看 Bootstrap 是否成功加载。在命令行中运行以下命令：

php artisan serve

然后，通过在浏览器中访问 http://localhost:8000 来查看您的应用程序的效果。

结论

通过遵循以上步骤，您已成功在 Laravel 8 中安装和配置了 Bootstrap。您现在可以使用 Bootstrap 的样式和组件来构建功能丰富的应用程序。