我正在检查这个问题:如何将 webjars.org 中的 Font Awesome 与 JSF 结合使用 https://stackoverflow.com/q/18891768/811293蚂蚁这个问题:FontAwesome 与 PrimeFaces https://stackoverflow.com/q/21052851/5113188及其答案https://stackoverflow.com/a/33070133/5113188 https://stackoverflow.com/a/33070133/5113188
嗨,我想使用新的图标https://fontawesome.com/changelog/latest https://fontawesome.com/changelog/latest 5.5 version
In my pom.xml
文件项目...
<dependency>
<groupId>org.primefaces</groupId>
<artifactId>primefaces</artifactId>
<version>6.2</version>
</dependency>
<dependency>
<groupId>org.primefaces.extensions</groupId>
<artifactId>primefaces-extensions</artifactId>
<version>6.2</version>
</dependency>
<dependency>
<groupId>org.omnifaces</groupId>
<artifactId>omnifaces</artifactId>
<version>2.1</version>
</dependency>
<!-- https://mvnrepository.com/artifact/org.webjars/font-awesome -->
<dependency>
<groupId>org.webjars</groupId>
<artifactId>font-awesome</artifactId>
<version>5.5.0</version>
</dependency>
in my web.xml
file
<!-- Fontawesome -->
<context-param>
<param-name>primefaces.FONT_AWESOME</param-name>
<param-value>true</param-value>
</context-param>
在我的 Facelet .xhtml 中
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:p="http://primefaces.org/ui"
template="/templates/template.xhtml">
<ui:define name="body">
<h:outputScript library="webjars" name="font-awesome/5.5.0/js/all.js"/>
...
<p:spacer width="10"/>6
<h:outputText styleClass="fas fas-map"/>7
<h:outputText styleClass="fa fa-venus-mars fa-icon-custom" />
<h:outputText styleClass="fa fa-female fa-icon-custom" />
<h:outputText styleClass="fa fa-male fa-icon-custom" />
注意:我正在使用fas
and fa
,但两者都不起作用
就像我的图片所示,所有图标都失败了
怎么解决这个问题?
PF 6.2.12 和 PF 6.3 中添加了使用 FontAwesome 5 的功能。请参阅此票证并提交,它增加了以下功能:
https://github.com/primefaces/primefaces/issues/4276 https://github.com/primefaces/primefaces/issues/4276
https://github.com/primefaces/primefaces/commit/c28c0bccc615bffb99c30825c8c7d8084c3a72da https://github.com/primefaces/primefaces/commit/c28c0bccc615bffb99c30825c8c7d8084c3a72da
在 web.xml 中关闭默认 PF 支持:
<context-param>
<param-name>primefaces.FONT_AWESOME</param-name>
<param-value>false</param-value>
</context-param>
更新您的 pom.xml。
<dependency>
<groupId>org.webjars</groupId>
<artifactId>font-awesome</artifactId>
<version>5.8.2</version>
</dependency>
对 JSF 使用正确的 WebJars CSS。
<h:outputStylesheet library="webjars" name="font-awesome/5.8.2/css/all.min-jsf.css" />
<h:outputStylesheet library="webjars" name="font-awesome/5.8.2/css/v4-shims.min-jsf.css" />
NOTE:您必须更改您的“fa”,因为现在 Font Awesome 已分为不同的类别,例如“fas”“fab”等。请参阅文档在这里 https://fontawesome.com/how-to-use/on-the-web/referencing-icons/basic-use.
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)