Question

我正在扩展我的应用程序中的Bootstrap主题。我想通过主题包含一些css和js文件。

我尝试将资源放在服务器上的文件夹中。我已经尝试将资源放在应用程序Web-Content文件夹中的“KendoUI”中。似乎这些方法都不起作用。当我在应用程序中打开一个Xpage时，它似乎没有加载任何东西。

如果我将资源直接放在Xpage中，我可以看到文件在那里（通过Chrome）。

我的主题语法是否有错误？

顺便说一句，css文件可以添加到样式下的资源中，js可以添加到Code下的脚本库中。我们还可以使用package explore将资源放在WebContent文件夹中。这两个地方放置资源有什么不同？

 <!--

    Use this pattern to include resources (such as style sheets
    and JavaScript files that are used by this theme.

  -->

<theme
    extends="Bootstrap3.2.0"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:noNamespaceSchemaLocation="platform:/plugin/com.ibm.designer.domino.stylekits/schema/stylekit.xsd">

<!-- Kendo Grid Resources Web Content-->
 <resources>
        <styleSheet href="KendoUI/styles/kendo.common.min.css"></styleSheet>      
        <script target="xsp" src="KendoUI/js/jquery.min.js" clientSide="true" type="text/x-javascript"/>   
        <script target="xsp" src="KendoUI/js/kendo.all.min.js" clientSide="true" type="text/x-javascript"/>   
</resources>    

<!-- Kendo Grid Resources File System-->    
<resource>
 <content-type>application/x-javascript</content-type>
 <href>/.ibmxspres/domino/KendoUI/js/jquery.mim.js</href>
</resource>



    <control>
        <name>ViewPanel.Disable.Header.Footer</name>
        <property
            mode="override">
            <name>viewStyle</name>
            <value>width:99%</value>
        </property>
        <property>
            <name>headerEndStyle</name>
            <value>display: none;</value>
        </property>
        <property>
            <name>headerStartStyle</name>
            <value>display: none;</value>
        </property>
        <property>
            <name>headerStyle</name>
            <value>display: none;</value>
        </property>
        <property>
            <name>footerStyle</name>
            <value>display: none;</value>
        </property>
        <property>
            <name>footerStartStyle</name>
            <value>display: none;</value>
        </property>
        <property>
            <name>footerEndStyle</name>
            <value>display: none;</value>
        </property>
        <property>
            <name>viewStyleClass</name>
            <value>xspDataTableViewPanel</value>
        </property>
        <property>
            <name>dataTableStyleClass</name>
            <value>xspDataTable</value>
        </property>
        <property>
            <name>headerRowStyleClass</name>
            <value>xspDataTableHeaderRow</value>
        </property>
        <property>
            <name>bodyRowStyleClass</name>
            <value>xspDataTableBodyRow</value>
        </property>
        <property>
            <name>bodyCellStyleClass</name>
            <value>xspDataTableBodyCell</value>
        </property>
        <property>
            <name>unreadMarksClass</name>
            <value>xspDataTableRowUnread</value>
        </property>
        <property>
            <name>readMarksClass</name>
            <value>xspDataTableRowRead</value>
        </property>
        <property>
            <name>captionStyleClass</name>
            <value>xspDataTableViewPanelCaption</value>
        </property>
    </control>
</theme>

Answer 1

每个资源都有自己的资源标记。我的CSS和JS在WebContent \ Libs

下的子文件夹中

<!-- fontawesome css-->
    <resource>
        <content-type>text/css</content-type>
        <href>libs/fontawesome/css/font-awesome.min.css</href>
    </resource>

<resource>
        <content-type>application/x-javascript</content-type>
        <href>libs/moment/min/moment.min.js</href>
    </resource>

Answer 2

根据您使用的扩展程序库版本，您可能需要仔细检查对Bootstrap 3主题的引用，该主题从Bootstrap3.2.0转移到Bootstrap3（以便进行更多无缝升级版本之间），introduced in 9.0.1 v16。

As Frank has outlined in his answer here，它们只是您可以指出的资源;因此，如果您将Kendo UI资产转储到WebContent中的文件夹中，请将其视为应用程序的“根”，并将其视为相对路径。

我不相信它“重要”（本身），是否将资产放入代码/资源设计元素界面而不是WebContent（例如 - 通过Package Explorer），但我更喜欢将库和框架转储到WebContent，以便保持代码和资源部分“没有混乱”，可以这么说。这也意味着，如果您切换到依赖关系管理解决方案（bower或其他），那么相对路径将不会发生太大变化。

确保使用相应的resource标记结构，就像Frank概述的那样;你似乎是通过“Kendo网格资源文件系统”评论为你的块做这个，但似乎已经偏离了块中的“Kendo Grid Resources Web Content”评论。 *注意：我没有在第一次阅读时注意到您正在使用resources块来表示那些

Xpages：引用主题

2 个答案: