我有一个用JHipster v4.9.0编写的项目,我正在升级到v 5.3.0。
我真的很想念早期版本的JHipster的社交登录功能,我需要在我的项目中使用社交登录按钮和服务。
我已经使用以下命令从https://libraries.io/npm/bootstrap-social安装了bootstrap social:
npm install [email protected]
现在我在我的package.json文件中有这一行
"bootstrap-social": "5.1.1",
然后我在登录页面
<a class="btn btn-block btn-social btn-facebook">
<span class="fa fa-facebook"></span>
Sign in with Facebook
</a>
但我的问题是我无法在我的按钮上看到facebook徽标。还有什么我需要做的才能让徽标显示出来吗?
Facebook徽标使用Font Awesome,它改变了v5中的导入。首先,将package.json中的以下包添加到指定版本(这包括社交网络等品牌图标):
"@fortawesome/free-brands-svg-icons": "5.3.1",
您还需要在vendor.ts中导入图标:
import {
faFacebook
} from '@fortawesome/free-brands-svg-icons';
....
library.add(faFacebook);
最后,您需要在HTML中添加图标,类似于其他人的使用方式(但为品牌图标指定fab
)。导航栏中有几个图标示例,Facebook图标如下所示:
<fa-icon [icon]="['fab', 'facebook']"></fa-icon>