Una vez que el archivo del paquete del proyecto de Vue se coloca en el servidor, el navegador tiene una solución al problema de la caché

Cada vez que prueba una compilación o paquete de una versión actualizada y la envía al servidor, ocasionalmente, es posible que no se actualice al último código a tiempo y el navegador tiene un problema de caché.

Solución uno:

Busque webpack.prod.conf.js para el proyecto inicializado por vue-cli2.xo webpack, y busque el archivo de configuración vue.webpack.js para vue-cli3.0

   1. Defina la variable de versión: const Version = new Date (). GetTime (); // La marca de tiempo se usa aquí para distinguir 

salida: { 
    ruta: config.build.assetsRoot, 
    nombre de archivo: utils.assetsPath ('js / [nombre]. [chunkhash].' + _ Versión + 'js'), 
    chunkFilename: utils.assetsPath ('js / [id]. [ chunkhash]. '+ _ Versión +' js ') 
  },

Luego, directamente después de empaquetar la compilación de ejecución npm, puede ver el nombre del archivo js en el archivo dist con el número de versión en él

Sin embargo, descubrimos que en la configuración predeterminada en vue-cli, los nombres de css y js tienen hash, por lo que los nombres de la nueva versión de css y js son diferentes de la versión anterior y no habrá problemas de almacenamiento en caché. Entonces puede ser que cuando el index.html empaquetado se coloca en el servidor, index.html puede almacenarse en caché en el lado del servidor, lo que requiere la configuración del servidor para evitar que index.html se almacene en caché.  

Solución dos:

configuración nginx, para que index.html no se almacene en caché

Al desarrollar y depurar la web, a menudo me encuentro con el problema de vaciar el caché o de realizar una actualización forzada para probar debido al caché del navegador (caché), y proporciono la configuración de apache sin caché y la configuración de nginx sin caché. Hay dos formas en las configuraciones de caché de uso común, las cuales se establecen usando add_header: Cache-Control y Pragma respectivamente.

add_header Cache-Control no-store; 
add_header Pragma sin caché;

 

El navegador sin caché almacenará en caché, pero solicitará al servidor cuando la página se actualice o se vuelva a abrir. El servidor puede responder con 304, si se cambia el archivo, responderá con 200. El 
navegador sin almacenamiento no almacena en caché, actualice la página y necesita descargar la página de nuevo

Supongo que te gusta

Origin blog.csdn.net/AN0692/article/details/108647787
Recomendado
Clasificación