Solución:
angular-cli resuelve esto proporcionando un --output-hashing
marca para el comando de compilación (versiones 6/7, para versiones posteriores, consulte aquí). Uso de ejemplo:
ng build --output-hashing=all
Bundling & Tree-Shaking proporciona algunos detalles y contexto. Corriendo ng help build
, documenta la bandera:
--output-hashing=none|all|media|bundles (String)
Define the output filename cache-busting hashing mode.
aliases: -oh <value>, --outputHashing <value>
Aunque esto solo es aplicable a los usuarios de angular-cli, funciona de manera brillante y no requiere ningún cambio de código ni herramientas adicionales.
Actualizar
Varios comentarios han amablemente y correctamente señaló que esta respuesta agrega un hash a la .js
archivos pero no hace nada por index.html
. Por tanto, es muy posible que index.html
permanece en caché después de ng build
caché rompe el .js
archivos.
En este punto, me referiré a ¿Cómo controlamos el almacenamiento en caché de la página web, en todos los navegadores?
Encontré una manera de hacer esto, simplemente agregue una cadena de consulta para cargar sus componentes, así:
@Component({
selector: 'some-component',
templateUrl: `./app/component/stuff/component.html?v=${new Date().getTime()}`,
styleUrls: [`./app/component/stuff/component.css?v=${new Date().getTime()}`]
})
Esto debería obligar al cliente a cargar la copia del servidor de la plantilla en lugar de la del navegador. Si desea que se actualice solo después de un cierto período de tiempo, puede usar esta ISOString en su lugar:
new Date().toISOString() //2016-09-24T00:43:21.584Z
Y subcadena algunos caracteres para que solo cambie después de una hora, por ejemplo:
new Date().toISOString().substr(0,13) //2016-09-24T00
Espero que esto ayude
En cada plantilla html, solo agrego las siguientes metaetiquetas en la parte superior:
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="0">
Según tengo entendido, cada plantilla es independiente, por lo que no hereda la configuración de reglas de almacenamiento en caché en el archivo index.html.