Font Awesome 字体在laravel的使用

许博达
2023-12-01

Font Awesome 提供了可缩放的矢量图标,允许我们使用 CSS 所提供的所有特性对它们进行更改,包括:大小、颜色、阴影或者其它任何支持的效果。

1. 安装

 $ yarn add @fortawesome/fontawesome-free

打开 package.json 可以看到新增了这一行依赖:

package.json

 {
.
.
.

    "dependencies": {
        "@fortawesome/fontawesome-free": "^5.6.3"
    }
}

2. 在样式中载入

resources/sass/app.scss

// Variables
@import 'variables';

// Bootstrap
@import '~bootstrap/scss/bootstrap';

// Fontawesome
@import '~@fortawesome/fontawesome-free/scss/fontawesome';
@import '~@fortawesome/fontawesome-free/scss/regular';
@import '~@fortawesome/fontawesome-free/scss/solid';
@import '~@fortawesome/fontawesome-free/scss/brands';

/* universal */
.
.
.

3. 运行mix编译命令

npm run watch-poll 
 类似资料: