Vue upgrade and caching optimisation

Author: iamtommetcalfe

index.html

@@ -32,8 +32,11 @@
       content="My name is Tom Stirrop-Metcalfe. I am a passionate and driven engineering leader who wants to enable others to realise their full potential."
     />
     <meta name="theme-color" content="#384452" />
-    <!-- Cache busting meta tag -->
-    <meta name="build-timestamp" content="<%= VITE_BUILD_TIMESTAMP %>" />
+    <!-- Cache busting meta tag and disable HTML caching -->
+    <meta name="build-timestamp" content="%VITE_BUILD_TIMESTAMP%" />
+    <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" />
     <title>Tom Stirrop-Metcalfe | Software Engineer & Engineering Manager | Birmingham</title>
 
     <!-- Open Graph / Facebook -->

package-lock.json

@@ -15,7 +15,7 @@
   },
   "dependencies": {
     "pinia": "^3.0.4",
-    "vue": "^3.5.27",
+    "vue": "^3.5.28",
     "vue-router": "^4.5.1"
   },
   "devDependencies": {

package.json

@@ -17,6 +17,16 @@
 import Header from './components/Header.vue';
 import Footer from './components/Footer.vue';
 import MrRobot from './components/MrRobot.vue';
+import { useHead } from '@unhead/vue';
+
+// Ensure all generated HTML pages include no-cache directives
+useHead({
+  meta: [
+    { 'http-equiv': 'Cache-Control', content: 'no-cache, no-store, must-revalidate' },
+    { 'http-equiv': 'Pragma', content: 'no-cache' },
+    { 'http-equiv': 'Expires', content: '0' },
+  ],
+});
 </script>
 
 <style>