es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Extensión de Chrome: JQuery no funciona en el script de contenido.

05 Aug, 2023 Programación

No estoy seguro de por qué mi jQuery no se está cargando correctamente en mi script de contenido a pesar de que tengo el archivo jquery.js en los recursos de la web accesibles. Siempre obtengo este error: “ReferenceError: $ no está definido”. Agradecería cualquier ayuda, gracias.

manifest.json

json
{
"name": "Trabaja de manera más inteligente",
"description": "Trabaja de manera más inteligente - Elimina las distracciones, sé productivo",
"version": "1.0",
"manifest_version": 3,
"background": {
"service_worker": "background.js"
},
"permissions": ["storage", "activeTab", "scripting", "tabs"],
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "/images/16x16.png",
"32": "/images/32x32.png",
"48": "/images/48x48.png",
"128": "/images/128x128.png"
}
},
"icons": {
"16": "/images/16x16.png",
"32": "/images/32x32.png",
"48": "/images/48x48.png",
"128": "/images/128x128.png"
},
"web_accessible_resources": [
{
"resources": ["contentscript.css", "images/neverGiveUp.png", "jquery.js"],
"matches": ["<all_urls>"]
}
],
"host_permissions": ["http://*/", "https://*/*"]
}

Tags:  , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Parece que el archivo jquery.js está incluido en los recursos accesibles en la web de tu archivo manifest.json. Sin embargo, es posible que el script de contenido se esté cargando antes de que se cargue completamente jquery.js. Para asegurarte de que jquery.js se cargue antes del script de contenido, puedes utilizar el campo “run_at” en la declaración de tu script de contenido en manifest.json:

    {
  "name": "Trabaja de manera más inteligente",
  "description": "Trabaja de manera más inteligente - Elimina distracciones, sé productivo",
  "version": "1.0",
  "manifest_version": 3,
  "background": {
    "service_worker": "background.js"
  },
  "permissions": ["storage", "activeTab", "scripting", "tabs"],
  "action": {
    "default_popup": "popup.html",
    "default_icon": {
      "16": "/images/16x16.png",
      "32": "/images/32x32.png",
      "48": "/images/48x48.png",
      "128": "/images/128x128.png"
    }
  },
  "icons": {
    "16": "/images/16x16.png",
    "32": "/images/32x32.png",
    "48": "/images/48x48.png",
    "128": "/images/128x128.png"
  },
  "web_accessible_resources": [
    {
      "resources": ["contentscript.css", "images/neverGiveUp.png", "jquery.js"],
      "matches": ["<all_urls>"]
    }
  ],
  "host_permissions": ["http://*/", "https://*/*"],
  "content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["jquery.js", "contentscript.js"],
      "css": ["contentscript.css"],
      "run_at": "document_idle"
    }
  ]
}

    En este ejemplo, “run_at”: “document_idle” asegura que el script de contenido se ejecute solo después de que la página esté completamente cargada, incluyendo jquery.js.

Comments are closed.