图标不显示的首要原因是字体文件缺失,需执行php artisan vendor:publish --provider="Encore\Admin\AdminServiceProvider" --force发布Font Awesome 4.x字体文件至public/vendor/admin/fonts/,并确保Nginx正确配置woff2等MIME类型及跨域头。

确认 public/vendor/admin/fonts/ 目录是否存在字体文件
图标不显示,第一反应不是改 CSS,而是看字体文件有没有真被放上去。laravel-admin 的图标依赖 Font Awesome 4.x 字体文件(如 fontawesome-webfont.woff2),这些文件不会自动出现在 public/ 下,必须靠 php artisan vendor:publish 手动复制。
执行完安装命令后,务必检查:ls -l public/vendor/admin/fonts/
你应该能看到类似 fontawesome-webfont.eot、fontawesome-webfont.woff2 等至少 5 个文件。如果该目录不存在,或只有空文件夹,说明资源没发布成功。
- 重试发布命令:
php artisan vendor:publish --provider="Encore\Admin\AdminServiceProvider" --force - 若提示“no assets to publish”,说明配置类未被识别,检查
config/app.php中是否漏注册了Encore\Admin\AdminServiceProvider - 发布后仍为空?手动进入
vendor/encore/laravel-admin/resources/assets/fonts/,确认原始字体文件存在;不存在则可能是 Composer 安装损坏,删掉vendor/encore重装
Nginx 返回 404 或 Content-Type 错误?补全字体 MIME 类型
即使字体文件物理存在,Nginx 默认不认 .woff2、.ttf 这些扩展名,会返回 Content-Type: text/plain 或干脆 404,浏览器直接拒载——这时 Network 面板里字体请求状态码是 404 或 Response Headers 里没有 font/woff2。
在 Nginx 站点配置的 server 块内,加一段 location 规则:
location ~ \.(woff2?|eot|ttf|otf|svg)$ {
add_header Access-Control-Allow-Origin *;
types {
font/woff woff;
font/woff2 woff2;
font/eot eot;
font/ttf ttf;
font/svg svg;
}
}
- 改完必须执行
sudo nginx -s reload,restart不生效 -
add_header Access-Control-Allow-Origin *不是可选的:跨域字体加载在现代浏览器中会被静默拦截,不加这句,即使路径对、类型对,也可能白屏 - 别把这段写在
location /里套着用——它必须是独立的 location 块,否则会被父级规则覆盖
图标类名写成 fa-solid fa-user,但页面加载的是 FA4?类名不匹配就白搭
打开浏览器开发者工具,看 <head> 里实际引入的 Font Awesome 是哪个版本。laravel-admin v1.x 默认用 FA4(类名形如 fa-users),v2.x 才支持 FA5+(需手动配置)。如果你在菜单里写 'icon' => 'fas fa-users',但页面加载的是 FA4 的 CSS,那图标必然不渲染——FA4 根本不认识 fas 这个前缀。
- 查源码:
Ctrl+U搜索font-awesome,看链接地址是否含/4.或/6. - 查配置:
config/admin.php中的'icons'项是否被自定义过;若没动过,基本就是 FA4 - 临时验证:在 Blade 模板里写
<i class="fa fa-users"></i>,看是否显示;若显示,说明 FA4 工作正常,问题出在菜单配置的类名上 - 切 FA5?别硬改类名,先在
config/admin.php里设'icons' => ['https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css'],再统一用fas fa-users
浏览器缓存骗人?Network 面板要勾选 “Disable cache” 再刷
字体文件一旦加载失败,浏览器可能缓存住 404 响应或错误的 MIME 类型,后续即使你改对了 Nginx 配置,也看不到变化。这时候光清 Laravel 缓存、硬刷新没用。
打开 DevTools → Network 标签页 → 勾选 Disable cache → 刷新页面 → 看 fontawesome-webfont.woff2 请求的状态码和 Response Headers 里的 Content-Type。
- 看到 200 +
Content-Type: font/woff2→ 字体链路通了 - 看到 200 +
Content-Type: text/plain→ Nginx MIME 配置没生效,回去检查 location 块位置和 reload 是否执行 - 看到 404 → 路径不对,回到第一步确认
public/vendor/admin/fonts/下文件是否真实存在且大小非零
最后提醒一句:字体文件名大小写敏感,FontAwesome-webfont.woff2 和 fontawesome-webfont.woff2 是两个文件,FA4 的 CSS 里写的是小写,你就不能传个首字母大写的上去。


















