2016-04-19 70 views
0

我爲Firefox創建了一個涉及簡單樣式表的主題。我目前使用時尚擴展,但想分享我的主題作爲Firefox插件(因爲主題是簡單的圖像)。 我沒有在搜索引擎中很快找到任何有關信息,只在MDN上找到過時的資源。如何從簡單樣式表創建Firefox主題(插件?)?

任何建議分享這個CSS作爲一個插件? (獎勵:從git倉庫自動發佈)

回答

2

如果它是一個簡單的樣式表,那麼您必須將樣式表附加到nsIDOMWindow。示例代碼插件-SDK

const { attachTo, detachFrom } = require("sdk/content/mod"); 
const { Style } = require("sdk/stylesheet/style"); 
const { getMostRecentWindow } = require("sdk/window/utils"); 
const { browserWindows } = require("sdk/windows"); 
const { viewFor } = require("sdk/view/core"); 
const style = Style({ 
    uri: "./index.css" // path to file 
}); 

attachTo(style, getMostRecentWindow()); 


browserWindows.on("open", function(window) { 
    attachTo(style,viewFor(window)); 
}); 

require("sdk/system/unload").when(function() { 
    for (let window of browserWindows) 
    detachFrom(style, viewFor(window)); 
}); 

編輯: 要開始使用插件-SDK,你必須有JPM。 Here它描述瞭如何安裝它。一旦你安裝了它,你應該創建一個包含你的擴展名的目錄。然後打開終端/控制檯並鍵入jpm init。根據您的需要填寫提示的字段。您還可以檢查these package.json中的其他選項(它位於目錄的根目錄中並帶有擴展名),並使用它們。

下一步是將我的代碼粘貼到index.js中(您可以將代碼粘貼到其他位置,但必須使用require導入該文件)。在擴展目錄中創建一個目錄「data」,並在那裏創建一個帶有樣式表的文件。然後在這裏替換「index.css」

uri: "./index.css" 

與您的文件名。

一旦你完成了,在終端/控制檯輸入jpm xpi,你的擴展就可以安裝了!祝你好運

+0

感謝您的回答。有關addon-sdk的更多詳細信息?我沒有找到任何簡單的教程從頭開始創建插件。 – MoOx

+0

我剛剛更新了我的答案。一旦完成,將生成「.xpi」文件,您將能夠安裝擴展程序(但您必須關閉證書檢查 - 您可以通過xpinstall.signatures.required首選項在about:config頁面中執行此操作 - 使其爲false) –

+0

感謝您的支持。這有很大幫助。我成功地創建了我的主題:)這就是說我有最後一個額外的問題:是否有一種簡單的方法可以在運行時編輯我的加載項而無需重新生成插件?我嘗試使用「工具」菜單中的「瀏覽器工具箱」,但沒有找到我的樣式表與其他人(請注意,我發現了一些不同的插件(Beyond Australis),可能使用不同的方式插入CSS https:// github .COM/Quicksaver /的福克斯 - 僅-更好)。任何提示輕鬆編輯已安裝的插件上的CSS? – MoOx

相關問題