javascript - Le développement front-end est fréquemment modifié. Comment résoudre le problème de cache lors de la prévisualisation?

Question

Notre société télécharge le projet de SVN vers le local, puis le télécharge sur le serveur après l'avoir modifié localement.
Le problème est maintenant que lorsque plusieurs styles sont modifiés localement ou que des js liés en externe sont prévisualisés dans le navigateur, les modifications ne sont pas visibles pour des raisons de cache, et le cache ne peut être vidé que manuellement. Cependant, c'est plus gênant lors des modifications. sont fréquents. Après avoir examiné la méthode d'ajout d'horodatages à fis, il semble que le projet ne soit reconfiguré que lors du déploiement ou de la mise à jour. Existe-t-il une bonne méthode pour ce genre de modification locale relativement fréquente ?

Answer 1

Désactivez le cache via Chrome
outils de développement Chrome > réseaux > cache désactivé, voir l'image ci-dessous

Answer 2

Ajouter le numéro de version après les fichiers CSS et JS

Answer 3

Vous pouvez utiliser le plug-in de nettoyage du cache de Chrome. Cliquez simplement sur le bouton de ce plug-in à chaque fois que vous actualisez la page. Vous n'avez pas besoin du bouton d'actualisation de Chrome.

Answer 4

Il est recommandé d'utiliser un outil de construction tel que webpack ou gulp Lors de la construction du projet, mettez le numéro de version après le fichier pour déclencher la requête du navigateur.

Answer 5

Développer et déployer du code front-end

Answer 6

Après chaque modification, vous pouvez ajouter un horodatage après le fichier pour vous assurer que le fichier demandé est un fichier nouvellement modifié, comme suit
<link rel="stylesheet" href="css/main.css?i=2017051101" >
<script src="js/config.js?i=2017051101"></script>

Answer 7

Le bouton sur la page peut être forcé à actualiser
Événement de liaison de bouton location.reload()

Answer 8

CMD + MAJ + R