laravel 9支持bootstrap 5图标吗？

tf7tbtn2 于 2023-01-27 发布在 Bootstrap

关注(0)|答案(1)|浏览(123)

这是我的laravel 9项目的composer.json文件

"devDependencies": {
        "@popperjs/core": "^2.11.6",
        "axios": "^1.1.2",
        "bootstrap": "^5.2.3",
        "bootstrap-icons": "^1.10.3",
        "laravel-vite-plugin": "^0.7.2",
        "lodash": "^4.17.19",
        "postcss": "^8.1.14",
        "sass": "^1.56.1",
        "vite": "^4.0.0"
    },

这是我的资源/js/app. js文件

import './bootstrap'
import '../sass/app.scss'
import * as bootstrap from 'bootstrap'
import '~bootstrap-icons/font/bootstrap-icons.css'

这是我的资源/sass/app.scss

// Fonts
@import url('https://fonts.bunny.net/css?family=Nunito');

// Variables
@import 'variables';

// Bootstrap
@import 'bootstrap/scss/bootstrap';
@import '~bootstrap-icons/font/bootstrap-icons.css';

现在，我的视图有引导图标类，但图标在浏览器中看不到。

<i class="fs-4 bi-speedometer2">
<i class="fs-4 bi-house">

我在浏览器中没有看到任何图标

laravel

来源：https://stackoverflow.com/questions/75192944/does-laravel-9-supports-bootstrap-5-icons

1条答案

按热度按时间

kxeu7u2r1#

Laravel 9没有内置的Bootstrap 5图标支持。但是，您可以通过安装必要的依赖项并相应地配置您的项目，轻松地将Bootstrap 5图标添加到您的Laravel 9应用程序。
通过运行以下命令将Bootstrap icons包添加到项目中：

composer require twbs/icons

安装包后，您需要导入项目的app.scss文件中的图标。

@import "~twbs/icons/scss/icons";

要使用这些图标，可以使用包提供的bi类。

<i class="bi bi-search"></i>

如果你想使用javascript图标，你需要导入app.js文件中的图标，并使用软件包提供的icons（）方法。

import 'twbs/icons';

icons();

你也可以使用SVG格式的图标，如果你需要的话。

<svg class="bi bi-search" width="1em" height="1em" viewBox="0 0 16 16" fill="currentColor" xmlns="http://www.w3.org/2000/svg">
  <path fill-rule="evenodd" d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"/>
  <path fill-rule="evenodd" d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"/>
</svg>

赞(0）回复(0）举报 2023-01-27

我来回答

laravel 9支持bootstrap 5图标吗？

1条答案

相关问题

热门标签

最新问答