Font Awesome 路径 404 是因 Apache 端口改为 8080 后，前端资源 URL 仍硬编码为 http://localhost（端口 80），导致字体请求发往错误地址；需同步更新 HTML 中 link 地址、Laravel 的 APP_URL、Mix 的 publicPath 及 Apache MIME 类型配置。
Font Awesome 路径 404 是因为 Apache 端口改了但资源路径没更新
改了 httpd.conf 里的 Listen 8080 和 ServerName localhost:8080，但前端引用的 Font Awesome CSS 或字体文件仍走默认 http://localhost/（即端口 80），浏览器发请求时被拒绝或返回 404。这不是 Font Awesome 本身的问题，是资源 URL 和实际服务端口不匹配。
常见表现：GET http://localhost/fonts/fa-solid-900.woff2 net::ERR_CONNECTION_REFUSED 或状态码 404；控制台看到字体请求地址里没有端口号。
- 检查所有 HTML 中的
<link rel="stylesheet">和 JS 动态插入的样式表 URL，确认是否硬编码了http://localhost/ - Laravel 项目中若用
mix()或asset()，确保APP_URL配置为http://localhost:8080（不是http://localhost） - 静态引入 CDN 版本时不受影响，但本地托管的字体文件（如放在
public/fonts/）必须通过正确端口访问
Laravel Mix 编译后字体路径错乱的典型原因
在 XAMPP 下运行 npm run dev 或 npm run build 后，mix() 生成的 CSS 里字体路径仍指向 /fonts/...，而 XAMPP 的 DocumentRoot 是 \xampp\htdocs\，但 Laravel 项目通常放在子目录如 \xampp\htdocs\myapp\ —— 这导致浏览器按根路径请求字体，实际却要从子目录下找。
根本问题：Laravel Mix 默认假设应用部署在域名根路径，没考虑 XAMPP 子目录结构。
XAMPP 8.0.30 是一款免费、开源的跨平台 Web 服务器集成包，专为快速搭建本地 PHP 开发环境而设计。该版本核心组件包括：Apache 2.4.56、MySQL 8.0.33、PHP 8.0.30、phpMyAdmin 5.2.1 等。它支持 Windows、Linux 和 macOS 系统，可让开发者在个人电脑上轻松模拟服务器环境，无需复杂配置即可运行 WordPress、Thin
- 在
webpack.mix.js中显式设置mix.setPublicPath('public')不够，还需配置mix.webpackConfig({ output: { publicPath: '/myapp/public/' } })（把myapp换成你的项目文件夹名） - 或者更稳妥：用
php artisan serve --port=8080替代 XAMPP 运行 Laravel，避开路径歧义 - 若坚持用 XAMPP，CSS 中的
@font-face的src必须是相对路径（如../fonts/fa-solid-900.woff2），不能是绝对路径/fonts/...
Apache 虚拟主机配置遗漏导致字体跨域或 403
启用多端口后，如果还配了 <virtualhost></virtualhost>，但没给字体文件类型加 MIME 支持，Apache 默认拒绝提供 .woff、.woff2 文件，返回 403 或空响应。
错误现象：字体请求返回 403 Forbidden，或 Network 面板显示 MIME type 为 text/html 而非 font/woff2。
- 编辑
\xampp\apache\conf\extra\httpd-vhosts.conf，在对应<virtualhost></virtualhost>块内加入：<IfModule mod_mime.c> AddType font/woff2 .woff2 AddType font/woff .woff AddType font/ttf .ttf </IfModule> - 同时确认
\xampp\apache\conf\httpd.conf中LoadModule mime_module modules/mod_mime.so未被注释 - 重启 Apache 生效
Windows hosts 文件与本地域名混淆引发的字体加载失败
有人为多项目配了 mysite.local 域名并改了 hosts，但 Font Awesome 的 CSS 里写了 url(//fonts.googleapis.com/...) 或本地路径用了 http://mysite.local/fonts/...，而浏览器实际访问的是 http://localhost:8080 —— 域名不一致触发 CORS 或路径解析失败。
最隐蔽的坑：CSS 里写的是 url(/fonts/fa-brands-400.woff2)，但页面在 http://mysite.local:8080 下打开，而 Apache 只监听了 localhost:8080，导致字体请求发向 http://mysite.local:8080/fonts/... 却没匹配到任何虚拟主机规则。
- 统一用
localhost:8080访问，别混用自定义域名，除非你确认所有<virtualhost></virtualhost>都已正确定义且hosts解析无误 - 检查浏览器 Network 面板，点开字体请求的 Initiator 列，看是哪个 CSS 文件、哪一行触发的请求，再顺藤摸瓜查路径拼写
- 临时把 Font Awesome 改成 CDN 引入（如
https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css），快速验证是否纯属本地路径问题
publicPath 写错，或一个 AddType 漏掉，而不是“图标不兼容 XAMPP”。 
