jQuery не работает в расширении Chrome

Question

Этот код был предоставлен мне в другом вопросе, который я задал, но я получаю ошибки в самом начале.Вот часть кода, вызывающая проблему:

// @require     http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js
// @require     https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js
// @resource    jqUI_CSS http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css
// ==/UserScript==

var cssResource = GM_getResourceText("jqUI_CSS");
GM_addStyle(cssResource);

$("#pickMe").datepicker();

Первая ошибка, которую я получаю: «GM_getResourceText не определен»

Если я закомментирую это, и следующая строка, тоследующая ошибка, которую я получаю: «uncaught referenceerror $ не определен».И я получаю это в последней строке.

Это похоже на то, что скрипт не получает jQuery от Google.

Есть идеи?Спасибо!

Answer 1

В Chrome пользовательские скрипты являются расширениями. Самый простой способ использовать внешние библиотеки - настроить код с помощью файла манифеста .

.

Загрузите jquery.min.js, jquery-ui.min.js и jquery-ui.css и поместите их в тот же каталог. Убедитесь, что вы разрешаете пути к изображениям (CSS), заменяя все вхождения url(...) на url(http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/...).

Создайте файл manifest.json и добавьте следующее содержимое:

{
    "name": "Name of your extension.",
    "version": "1.0",
    "manifest_version": 2,
    "content_scripts": [{
        "js": [
               "jquery.min.js",
               "jquery-ui.min.js",
               "mycode.js"
              ],
        "css": [ "jquery-ui.css" ],
        "matches": [ "http://similarto-at-include-in-greasemonkey.com/*" ],
        "run_at": "document_end"
    }]
}

Создайте файл с именем mycode.js (или любое другое имя) и добавьте следующее содержимое:

$("#pickMe").datepicker();

Вы можете загрузить или упаковать ваше расширение через chrome://extensions/, режим разработчика.