JHipster和社交登录按钮

JHipster和社交登录按钮,jhipster,Jhipster,我有一个用JHipster v4.9.0编写的项目,我正在升级到V5.3.0 我真的很怀念JHipster早期版本的社交登录功能,我需要在我的项目中重新使用社交登录按钮和服务 我已经安装了来自社交网站的bootstrap 使用命令: npm install bootstrap-social@5.1.1 现在我的package.json文件中有一行 "bootstrap-social": "5.1.1", 然后我在我的登录页面 <a class="btn btn-block btn-so

我有一个用JHipster v4.9.0编写的项目,我正在升级到V5.3.0

我真的很怀念JHipster早期版本的社交登录功能,我需要在我的项目中重新使用社交登录按钮和服务

我已经安装了来自社交网站的bootstrap 使用命令:

npm install bootstrap-social@5.1.1
现在我的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标志。要让徽标显示出来,我还需要做些什么吗?

Facebook徽标使用的是令人敬畏的字体,这改变了v5中的导入。首先,将package.json中的以下包添加到指定版本(包括社交网络等品牌图标):

您还需要导入vendor.ts中的图标:

import {
    faFacebook
} from '@fortawesome/free-brands-svg-icons';
....
library.add(faFacebook);
最后,您需要在HTML中添加图标,类似于其他图标的使用方式(但为品牌图标指定
fab
)。导航栏中有几个图标示例,Facebook图标如下所示:

<fa-icon [icon]="['fab', 'facebook']"></fa-icon>

<fa-icon [icon]="['fab', 'facebook']"></fa-icon>