v6 到 v7 的迁移较为平滑,CSS 前缀保持一致,主要变化在图标设计和 SVG 框架 API。

v6 → v7 主要变更

迁移步骤

  1. 更新 package.json 中的版本号:npm install @fortawesome/[email protected]
  2. 更新 CDN 链接到 v7 版本
  3. 检查 SVG 框架调用方式是否需要调整
  4. 逐页测试图标显示效果

常见图标类名变更对照

v5 类名v6 类名说明
fas fa-homefa-solid fa-home前缀全拼化
far fa-userfa-regular fa-user前缀全拼化
fab fa-githubfa-brands fa-github品牌前缀全拼化
fas fa-boltfa-solid fa-bolt前缀全拼化
far fa-clockfa-regular fa-clock前缀全拼化
fas fa-searchfa-solid fa-search前缀全拼化
提示:迁移后请特别注意导航栏、按钮、表单等高频使用图标的显示效果。建议使用自动化测试或视觉比对工具辅助验证。

更详细的迁移指南请参考 FontAwesome 官方升级文档

分享此页:

相关阅读