添加CSS文件到Chrome擴展清單不工作

我試圖獲得一個外部CSS文件加載到Chrome中。要做到這一點，似乎我不得不修改現有的Chrome擴展的manifest.json檔案和最低限度地添加以下到content_scripts節點：添加CSS文件到Chrome擴展清單不工作

{ 
    "css": [ "Theme.css" ] 
}

據我瞭解，這將增加Theme.css文件（它位於與manifest.json文件相同的根目錄中）到Chrome中訪問的所有頁面。我看到我還可以通過包含matches鍵值對來限定json塊，但我在此省略了這一點。

這似乎沒有工作，因爲我沒有看到樣式。首先，我Theme.css文件包含此：

span { 
    color: green !important; 
}

此外，我已經確認爲「已啓用」，由鍍鉻我把它添加到（AngularJS Batarang FWIW）的擴展是公認的。

我也嘗試瞭解決方案here，您通過JS文件加載CSS作爲可訪問的資源，但這也不起作用。

我錯過了什麼？還是有更簡單的方法來做到這一點？

FWIW：這裏是整個manifiest：

{ 
    "background": { 
     "scripts": [ "background.js" ] 
    }, 
    "content_scripts": [ { 
     "js": [ "inject.js" ], 
     "matches": [ "<all_urls>" ], 
     "run_at": "document_start" 
    }, { 
     "matches": [ "http://*/*", "https://*/*"], 
     "css": [ "Theme.css" ] 
    } ], 
    "description": "Extends the Developer Tools, adding tools for debugging and profiling AngularJS applications.", 
    "devtools_page": "devtoolsBackground.html", 
    "icons": { 
     "128": "img/webstore-icon.png", 
     "16": "img/webstore-icon.png", 
     "48": "img/webstore-icon.png" 
    }, 
    "key": "MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQC9hsXx3+F75DyGto3mkm0FB2sycQzyMqXQAySn2Qj67vIHFMSrVZ0ItPzGnWJwoRoaDI7cQF9c/WLDpLJQwGe5CV5z84MueOME3e45JJEwN+YsW5ufEavmp+pk1c9h/Wyi8bMoSWJGIrOG72wCTFOdnyN6nocA0dm4w7UWsxLLEQIDAQAB", 
    "manifest_version": 2, 
    "minimum_chrome_version": "21.0.1180.57", 
    "name": "AngularJS Batarang", 
    "page_action": { 
     "default_icon": { 
     "19": "img/icon19.png", 
     "38": "img/icon38.png" 
     }, 
     "default_title": "AngularJS Super-Powered" 
    }, 
    "permissions": [ "tabs", "<all_urls>" ], 
    "update_url": "https://clients2.google.com/service/update2/crx", 
    "version": "0.10.6", 
    "web_accessible_resources": [ "dist/hint.js" ] 
}

來源

2016-03-04 im1dermike

這將幫助，如果你可以列出你'manifest.json' –

哪些網頁你測試此？ – Xan

@HaibaraAi更新了問題。 – im1dermike

您沒有註冊任何網頁應用CSS文件。 matches section is required。

如果你想將它應用到所有頁面，使用"matches": ["<all_urls>"]

來源

2016-03-04 20:28:51

我剛剛嘗試過'{「matches」：[「」]，「css」：[「Theme.css」]}'，但仍然不起作用。如果通過改變你想讓我填寫''，我以前也嘗試過這樣做：'「matches」：[「http：// */*」，「https：// */*」]''。 – im1dermike

@ im1dermike這是您發佈的部分清單中唯一缺少的東西。如果你仍然遇到麻煩，那麼你有責任發佈你的[mcve]的整個清單。 – Teepeemm

添加CSS文件到Chrome擴展清單不工作

回答

相關問題