在我的XPages应用程序中，将fontawesome从4.7升级到5.13，有些问题。

Question

在我的XPages应用程序中，我想把fontawesome的版本从4.7（当前）升级到5.13（最新？

所以我添加了资源并添加到我的主题设计元素。

<resource>
        <content-type>text/css</content-type>
        <href>font-awesome/5.13.0/css/solid.css</href>
    </resource>
    <resource>
        <content-type>text/css</content-type>
        <href>font-awesome/5.13.0/css/v4-shims.css</href>
    </resource>
    <resource>
        <content-type>application/x-javascript</content-type>
        <href>font-awesome/5.13.0/js/solid.js</href>
    </resource>
    <resource>
        <content-type>application/x-javascript</content-type>
        <href>font-awesome/5.13.0/js/v4-shims.js</href>
    </resource>

我没有更新字体引用，而且当我重新加载一个页面时，奇怪的是所有当前图标都以某种方式显示为 "斜体"，应该是这样吗？

我也定义了一些css伪元素，例如：。

label.required:after {
    margin-left: 5px;
    font-family: "FontAwesome";
    content: "\f069";
    color: #d9534f;
    font-weight: normal;
    font-size: 14px;
}

但这里的星号图标不再显示了。我应该如何处理这个问题？

最后（对于这个帖子），我在控制台得到2个错误。

GET http:/dev.acme.orgxsp.ibmxspres.extlibresponsivedijitdbootstrap-0.1.1themedbootstrapfontfontawesome-webfont.woff。 net::ERR_ABORTED 404 (Not Found)

http:/dev.acme.orgxsp.ibmxspres.extlibresponsivedijitdbootstrap-0.1.1themedbootstrapfontfontawesome-webfont.ttf。 net::ERR_ABORTED 404 (Not Found)

我忘记了什么？

P.s. 如果我选择使用一个工具包而不是自己托管文件，伪类和斜体显示的问题就不会发生。但我仍然有2个文件丢失的错误

Answer 1

把你的css更新为：

label.required:after { margin-left: 5px; font-family: "Font Awesome 5 Free"; content: "\f069"; color.#d9534f; font-family: "Font Awesome 5 Free"; content: "\f069"; color: #d9534f; font-weight: normal; font-size: 14px;}。

可能解决你的星号问题？

Answer 2

如果你同时加载两个版本呢？

<resource>
        <content-type>text/css</content-type>
        <href>font-awesome/4.7.0/css/font-awesome.css</href>
    </resource>

    <resource>
        <content-type>text/css</content-type>
        <href>font-awesome/5.13.0/css/solid.css</href>
    </resource>
    <resource>
        <content-type>text/css</content-type>
        <href>font-awesome/5.13.0/css/v4-shims.css</href>
    </resource>
    <resource>
        <content-type>application/x-javascript</content-type>
        <href>font-awesome/5.13.0/js/solid.js</href>
    </resource>
    <resource>
        <content-type>application/x-javascript</content-type>
        <href>font-awesome/5.13.0/js/v4-shims.js</href>
    </resource>

fontawesome 5没有使用fontawesome-webfont，所以它一定是你使用的主题中的一个引用（bootstrap-flat? https:/wiki.openntf.orgdisplayEXTLIBHow+to+use+the+Bootstrap3_blank.theme+in+XPages。

在本专题中曾讨论过 为什么我在我的网页Xpages上得到了multipleDefine错误。 但没有给出真正的例子，祝你好运!

Answer 3

试着通过headtag例子加载样式表。

    <xp:headTag tagName="link">
        <xp:this.attributes>
            <xp:parameter
                name="rel"
                value="stylesheet">
            </xp:parameter>
            <xp:parameter
                name="type"
                value="text/css">
            </xp:parameter>
            <xp:parameter
                name="href"
                value="font-awesome-5.13.0/css/all.css">
            </xp:parameter>
        </xp:this.attributes>
    </xp:headTag>