自动转换不同版本间的 FontAwesome 类名
| 变更项 | 说明 | 影响程度 |
|---|---|---|
fa- 前缀 | 基础类名 fa 不再自动生效，需完整使用 fa-solid/fa-regular/fa-brands | 高 |
| 图标重命名 | 约 50 个图标名称发生变化，以消除命名冲突 | 中 |
| CSS 变量 | 新增 CSS 自定义属性支持，旧版 CSS 变量已废弃 | 中 |
| SVG 框架 | SVG 框架配置项调整，部分旧配置不再兼容 | 低 |
| JS API | 部分 JavaScript 方法已标记为废弃或移除 | 低 |
| 移除的图标 | 极少部分商标过期或不活跃的品牌图标被移除 | 低 |
将 CDN 或包版本更新到 7.0.0：
<!-- 旧版 v6 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
<!-- 新版 v7 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.0/css/all.min.css">
<!-- NPM 更新 -->
npm install @fortawesome/[email protected]确保所有图标使用了完整的前缀：
<!-- 旧写法（v6 中部分可用，v7 不再支持） -->
<i class="fa fa-user"></i>
<!-- 新写法（v7 必须） -->
<i class="fa-solid fa-user"></i>
<i class="fa-regular fa-user"></i>以下图标在 v7 中已重命名，请进行替换：
| 原名称 (v6) | 新名称 (v7) |
|---|---|
fa-adjust | fa-circle-half-stroke |
fa-car | fa-car-side |
fa-clock | fa-clock-four |
fa-edit | fa-pen-to-square |
fa-remove | fa-xmark |
fa-times | fa-xmark |
如果使用了 SVG 框架，请调整配置项：
// v6 旧配置
FontAwesomeConfig = { autoReplaceSvg: 'nest' };
// v7 新配置
FontAwesomeConfig = { autoReplaceSvg: 'async' };在测试环境中全面检查图标显示、功能完整性，确认无误后再部署到生产环境。
v7 移除了对 fa 前缀的自动补全支持。所有图标必须显式指定前缀：
fa-solid fa-icon-name - 实心样式fa-regular fa-icon-name - 常规样式fa-brands fa-icon-name - 品牌图标v7 引入了新的 CSS 变量命名规范。旧变量 --fa-primary-color 变更为 --fa-primary-color-h、--fa-primary-color-s、--fa-primary-color-l。
以下 JavaScript API 已移除：fontawesome.dom.i2svg()、fontawesome.dom.css()。建议使用 fontawesome.dom.watch() 替代。
如果在升级过程中遇到任何问题，可以参考以下资源：