GWT 使用多个 CssResources 初始化 ClientBundle

GWT Initialize ClientBundle With Multiple CssResources

我正在努力将一些遗留代码更新为 GWT 2,但我 运行 遇到了一些奇怪的行为。我有一个根据 gwt 文档扩展 ClientBundle 的自定义界面。在该包中,我定义了几个 CssResources 以指向我的模块的各种 .css 文档。当我去实际初始化我的模块时,问题就来了。我在初始化程序中有一些代码获取每个 CssResource 的静态引用并调用 ensureInjected()。问题是,只有第一次调用才真正起作用。任何后续调用似乎都会被忽略,并且 css 样式不会添加到应用程序中。我需要做什么才能为单个模块处理多个 css 文档?

CssBundle.java

public interface CssBundle extends ClientBundle {
    public static final CssBundle INSTANCE = (CssBundle) GWT.create(CssBundle.class);

    /* CSS */
    @Source("mypath/public/Client.css")
    public ClientCss mainCSS();

    @Source("mypath/resources/css/mini/ext-all.css")
    public ExtAllCss extAllCSS();
}

ClientCss.java

public interface ClientCss extends CssResource {

    String applicationTitle();

    String branding();

    String bugReportDirections();

    @ClassName("Caption")
    String caption();
}

ExtAllCss.java

public interface ExtAllCss extends CssResource {
    @ClassName("close-icon")
    String closeIcon();

    @ClassName("close-over")
    String closeOver();

    @ClassName("col-move-bottom")
    String colMoveBottom();
}

MyModule.java

public class MyModule extends Composite
{
    public void initialize()
    {
        //this css shows up in the client
        CssBundle.INSTANCE.mainCSS().ensureInjected();
        //this does nothing
        CssBundle.INSTANCE.extAllCSS().ensureInjected();
    }
}

该代码看起来完全正确,但可能无法按您预期的方式运行 - 而不是每个 ensureInjected() 导致创建一个新的 <style> 块,而是它们只是将它们需要的样式排入队列可用,并在当前事件循环的末尾添加一个 <style>,其中包含所有收集到的样式。这限制了文档可能需要重新设计样式的次数,并且还有助于减少样式标签的数量(旧 IE 有一个错误,可能存在最大数量的标签)。

要确认这一点,请检查 <style> 标签的全部内容,您应该会看到两个 css 文件都附加在那里,一个接一个。