在下流css中使用來自ClientBundle的混淆CSS名稱

Question

我有一個帶有一些CSS的庫以及一個在CSS上展開的依賴項目。我試圖將它們都移到ClientBundle。

目前，library.css是

.smallWindow { min-width: 10px; outline: none; } 

而且depProject.css是

.sectionA .smallWindow { color: blue; } 

我在各自的項目中移動library.css和depProject.css到ClientBundles（LibraryBundle和DepProjectBundle）但必須在兩者中將smallWindow標記爲外部。有沒有辦法將depProject.css中的smallWindow鏈接到library.css中的smallWindow並且仍然有smallWindow被模糊處理？

我希望，而不是標誌着@external .smallWindow我可以離開它獨自在library.css，並把像@replaceWithObfuscated smallWindow DepProjectBundle.css.smallWindow在depProject.css

Answer 1

頂部的註釋被稱爲@external是有原因的:)這是對於我們無法控制的外部類，這符合你的情況。恰巧你的外部項目也是一個GWT項目，但這並不重要 - 除非你同時編譯這兩個項目，否則我不會看到任何（簡單且不冒昧的）連接方式（自動）從LibraryBundle模糊的類名稱到DepProjectBundle。

<tech (?) rant>
ClientBundle做所有這在編譯時的工作 - 它知道在這一點上的CSS，例如，對於包含在UiBinder的模板（該<ui:style>元素所有的類名稱可以創建非撞擊的類名的一切在編譯時轉換爲CssResource）。因此，您可以在您的WidgetA'UiBinder模板中創建一個名爲.warning的CSS類，並在WidgetB'UiBinder模板中創建一個不同的.warning類。在編譯過程中，它們將被分配不同的混淆名稱（因爲它們的是不同的類別）。現在，讓我們看看你的情況：編譯LibraryBundle，然後編譯（獨立）DepProjectBundle - 這是可能的（混淆前綴越短，越有可能，你應該重寫默認的長GWT前綴BTW）會得到相同的命名CSS類（當然這很可能有不同的目的）。因此，如果您盲目地將LibraryBundle中的類包含到DepProjectBundle中，您可能會（在某個時候）引入名稱衝突。
</tech (?) rant>

如果你真的想避免@external（這是一個好主意，我承認:)），我建議如下：包括您LibraryBundle到您的項目作爲svn:externals（你是使用SCM，對嗎？）或者在您的SCM或文件系統中可用的符號鏈接或其他任何方式 - 基本上，您將無縫地在許多項目中共享相同的LibraryBundle代碼（我認爲這是我們的目標），同時具有GWT編譯器的編譯時支持。

---

更新響應史蒂夫的評論：

看來我已經從你最初的問題誤解你的項目結構 - 我是說你想鏈接到LibraryBundle的編譯輸出的印象.. 。但是，由於您使用的源工作（通過Maven的，好:)），則不需要我svn:externals想法（順便說一句，你可以把任何存儲庫路徑在svn:externals財產，包括你的軀幹分支）。
反正，我的印象是一個很容易將兩個CssResource s轉換之一，但可惜... 這是我到目前爲止已經試過，都失敗了，但也許從這個名單東西會引發一些高招中有人;）（CUE這裏了一長串......）劃痕，在我的失敗總結的過程中，我想出了答案:)

答案是：

的@Import註釋（結合@ImportedWithPrefix獲得更有意義的前綴）。你ProjectBundle應該是這樣的：

public interface DepProjectBundle extends ClientBundle { 
    public static final DepProjectBundle INSTANCE = GWT.create(DepProjectBundle.class); 
    // Need this to reference the class names 
    // But maybe we can use the one in LibraryBundle? 
    // Have fun testing that :) For simplicty, I'll leave it here 
    Library library(); 

    // The good stuff 
    @Import({Library.class}) 
    Main main(); 
} 

Library是從LibraryBundle（或者也可以是整個LibraryBundle有沒有試過？）一個CssResource。最重要的東西是@Import註釋（正常CSS @import url(some.css)不ClientBundle工作 - 我已經試過;））
現在，你用這個DepProjectBundle這樣：

DepProjectBundle.INSTANCE.library().ensureInjected(); 
DepProjectBundle.INSTANCE.main().ensureInjected(); 

Label label = new Label("Test"); 
label.addStyleName(DepProjectBundle.INSTANCE.library().smallWindow()); 
VerticalPanel vPanel = new VerticalPanel(); 
vPanel.addStyleName(DepProjectBundle.INSTANCE.main().sectionA()); 
vPanel.add(label); 
RootPanel.get().add(vPanel); 

注意，我們使用的是DepProjectBundle.library() CssResource引用library.css「名稱空間」中的名稱。
但main.css中需要一個重要更改 - 爲了避免名稱衝突，編譯器使用前綴導入類名 - 它使用類的名稱或通過@ImportedWithPrefix註釋提供的名稱。所以，你的main.css將不得不改變，以這樣的事（讓我們假設你使用library作爲前綴）：

.sectionA .library-smallWindow { 
    color: blue; 
} 

不幸的是，有沒有辦法解決這個（我發現:)）。但從長遠來看，這可能是有益的 - 如果您忘記了library.css中使用的名稱以及main.css中的哪些名稱（這可能會導致一些奇怪的CSS衝突） - 以這種方式明確定義（在main.css ）這個類名屬於library.css（它最終會被混淆，所以沒有額外的字節被浪費掉）。

哎喲，希望這個解決方案對你（和其他人:)有幫助！）我會留下我最初的想法，因爲別人可能沒有使用（從開始:)）外部的源ClientBundle的svn:externals想法可能是使用不使用像Maven的工具，有人等