Hola usuario de nuestra web, hallamos la respuesta a tu pregunta, deslízate y la verás un poco más abajo.
Solución:
He respondido esto en otra pregunta. Creo que alguien debería fusionarlos, pero mientras tanto, dado que es muy similar y frustrante, lo pondré aquí para la próxima persona que busque ayuda.
Configurar
Configuraremos solo un par de elementos para que puedas codificar en tu editor y ver los cambios reflejados en el navegador sin molestias.
- Vaya a Chrome -> Extensiones (o pegue ‘chrome://extensions’ en su barra de URL) y busque la ‘tarjeta’ de TamperMonkey. Hacer clic detalles. En la página que se abre, permítale acceder a las URL de los archivos:
-
Guarde su archivo de script donde quiera en su sistema de archivos. Guarde todo, incluido el
==UserScript==
encabezamiento. Estoy usando macOS, por lo que mi ruta es:/Users/me/Scripts/SameWindowHref.user.js
-
Ahora, vaya al panel de la TM en su navegador, abra el script en cuestión en su editor de TM y elimine todo excepto la totalidad
==UserScript==
encabezamiento -
Añadir al encabezado un
@require
propiedad que apunta a la ruta absoluta del script.
En este punto, el editor de TM debería verse así:
Posible error: Utilizando el file://
Ahora se requiere el esquema de URI al comienzo de su ruta @require. En los sistemas de Windows sería:
// @require file://C:pathtouserscript.user.js
Para macOS y *nix, necesitaremos tres barras inclinadas seguidas:
// @require file:///path/to/userscript.user.js
Contextos de ejecución
Si tiene varios archivos JavaScript, cada uno especificado con un @require
key, es importante comprender cómo y cuándo se ejecuta cada script. Esto es importante cuando se usan bibliotecas externas (como jQuery) o cuando se segmentan los scripts como una buena práctica de codificación.
Él @require
las rutas pueden hacer referencia *.user.js
o simplemente *.js
archivos, y cualquier encabezado de comentario de estilo UserScript en estos archivos tiene sin efecto.
Del guión principal ==UserScript==
cabecera, todo @require
los archivos son texto concatenado en el orden especificado, con una sola línea nueva que separa cada archivo. Esta fusión luego se ejecuta como un gran script. Tenga en cuenta que esto significa que cualquier función o variable declarada en el ámbito más externo de cualquier archivo se comporta como si se hubiera declarado en el ámbito más externo de cada archivo, y ciertos errores sintácticos en un archivo pueden influir en cómo se interpretan los archivos posteriores. Además, para habilitar el modo estricto en todos sus archivos, 'use strict';
debe ser el primera declaración de El primer archivo listado con @require
.
Después de ejecutar todos los archivos @require, el UserScript principal (al que accede el editor de TamperMonkey) se ejecuta en un contexto separado. Si se desea el modo estricto, también debe habilitarse aquí.
Dada tal oportunidad de confusión, es una buena práctica que cada archivo envuelva todo el código dentro de un IIFE (y un nivel de función). 'use strict';
) con el fin de limitar el alcance a archivos individuales.
flujo de trabajo
Ahora, cada vez que ese script coincida (@match
), TamperMonkey cargará y ejecutará directamente el código directamente desde el archivo en el disco, cualquiera que sea la ruta en la que se encuentre. @require
.
Yo uso VSCode (posiblemente el mejor editor de código multiplataforma nunca. 100% gratis y de código abierto), así que ahí es donde trabajo en el guión, pero cualquier editor de texto servirá. Debe tener un aspecto como este:
Observe cómo el editor de TM y su IDE/Editor tienen el mismo encabezado. Ahora puede cerrar el editor de TM. Si todo está correcto, ya no necesitarás abrirlo.
Ahora, cada cambio en el código es guardado automáticamente por este editor en particular. Si el tuyo no se guarda automáticamente, recuerda guardar antes de ir al navegador para probarlo.
Por último, tendrás que recargar el sitio web para ver los cambios.
Si no está usando git, debería considerar usarlo con sus scripts de usuario, una herramienta beneficiosa para un proceso de desarrollo sensato, y GitHub para lanzar nuevas actualizaciones para sus usuarios de forma gratuita y automática.
Y por favor comparte todas tus creaciones 🙂
¡Consejos extra!
Trabajando con GitHub u otros SCM
Tienes que agregar un @updateURL
etiqueta seguida de la URL con el crudo archivo de GitHub o cualquier proveedor que elija. Ejemplo de GitHub:
Tenga en cuenta que un @version
Se requiere la etiqueta para que las comprobaciones de actualización funcionen. La gran mayoría de los usuarios no necesitarán la @downloadURL
etiqueta, así que, a menos que su secuencia de comandos tenga una base de seguidores masiva, use @updateURL
.
TM buscará actualizaciones con la frecuencia con la que esté configurado; desde la pestaña de configuración:
Exterioridadestablece la frecuencia con la que los scripts llaman desde su script @require
se comprueban para actualizar (por ejemplo, jQuery).
También puede “forzar” una verificación de actualización:
Uso de bibliotecas externas (como jQuery)
debe estar presente al menos en el editor de TM para que Chrome lo cargue. Sin embargo, recomiendo mantener ambos encabezados (el TM y el archivo en el encabezado del disco) iguales para evitar confusiones. Entonces, solo @require
es así:
// @require https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js
Si entiendes que te ha resultado provechoso este artículo, sería de mucha ayuda si lo compartieras con otros programadores así contrubuyes a extender nuestro contenido.