26

Overrides, cómo activarlo y usarlo

Hola, hoy les quiero enseñar cómo activar los overrrides en Chrome DevTools y en que casos me ha sido útil esta herramienta.

¿Que son los Overrrides?

Es una herramienta que nos permite realizar cambios en DevTools y mantener esos cambios en todas las cargas de la página.

¿Por qué son útiles?

Cuando necesitamos hacer cambios en un proyecto que ya esta publicado y no queremos perder los cambios que vamos realizando en DevTools cuando recarguemos el navegador.

Paso a paso:

1. Habilitar los Overrides

Lo primero que debemos hacer es ir a los settings de los DevTools.

Step01
Step02

2. Seleccionar carpeta local

Ahora debemos seleccionar la carpeta en nuestro disco local donde se guardara la copia de los archivos que editemos.

Para eso vamos al panel de Sourece y allí buscamos la opción de Overrides

Step03
Step04

3. Editar archivos

En este punto ya podremos editar los estilos o los scripts de la pagina, cuando realices un cambio puedes ver que se activa el siguente icono en el panel de estilo, lo unico que debes recordar es salvar ese archivo para que la próxima que recargues la página no se pierdan los cambios que realizaste.

Step05

Y por último si revisas la carpeta local donde guardaste los Overrides notaras que estan los archivos que editaste con organizado según el arból de directorios del sitio.

Step06

Espero te sea tan últil cómo lo ha sido para mi en mi día a día.

Escribe tu comentario
+ 2
2
5901Puntos

Una consulta, que diferencia hay entre FileSystem y Overrides?

1
24281Puntos
2 meses

el filesystem te permite poder actualizar tus archivos de forma directa, mientras que el overrides no, en mi caso utilizo este ultimo para saber si los cambios que estoy dando si mejoran el performance