Fix issue with base URL

zfox23 · zfox23 · commit c82ee0fb6206 · 2024-09-23T14:05:17.000-04:00
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -8,7 +8,7 @@ import tailwind from '@astrojs/tailwind';
 // https://astro.build/config
 export default defineConfig({
   site: 'https://zfox23.github.io',
-  base: 'spatial-photo-webxr-viewer',
+  base: '/spatial-photo-webxr-viewer',
   integrations: [react(), tailwind()],
   vite: {
     server: {
diff --git a/src/components/LoadingMesh.jsx b/src/components/LoadingMesh.jsx
@@ -2,7 +2,7 @@ import * as THREE from 'three';
 import { useTexture } from "@react-three/drei";
 
 export default function LoadingMesh() {
-    const [immersiveLoadingTexture] = useTexture(['/ImmersiveLoading.jpg'], ([tex]) => {
+    const [immersiveLoadingTexture] = useTexture([`${import.meta.env.BASE_URL}/ImmersiveLoading.jpg`], ([tex]) => {
         tex.repeat.set(2, 1);
         tex.wrapS = tex.wrapT = THREE.RepeatWrapping;
     });
diff --git a/src/components/NoImageMesh.jsx b/src/components/NoImageMesh.jsx
@@ -2,7 +2,7 @@ import * as THREE from 'three';
 import { useTexture } from "@react-three/drei";
 
 export default function NoImageMesh() {
-    const [immersiveLoadingTexture] = useTexture(['/NoImage.jpg'], ([tex]) => {
+    const [immersiveLoadingTexture] = useTexture([`${import.meta.env.BASE_URL}/NoImage.jpg`], ([tex]) => {
         tex.repeat.set(2, 1);
         tex.wrapS = tex.wrapT = THREE.RepeatWrapping;
     });
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
@@ -12,7 +12,7 @@ const { title } = Astro.props;
 		<meta charset="UTF-8" />
 		<meta name="description" content="View Apple's Spatial Photos in 3D VR with your browser via WebXR." />
 		<meta name="viewport" content="width=device-width" />
-		<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
+		<link rel="icon" type="image/svg+xml" href={`${import.meta.env.BASE_URL}/favicon.svg`} />
 		<title>{title}</title>
 	</head>
 	<body class="min-h-screen w-full">
diff --git a/src/pages/index.astro b/src/pages/index.astro
@@ -14,7 +14,7 @@ import GitHubIcon from "../components/icons/GitHubIcon";
 		<a href="https://zachfox.photography" class="group" target="_blank">
 			<img
 				class="w-7 h-7 opacity-75 group-hover:scale-110 group-hover:opacity-100 group-active:scale-100 transition-transform duration-75"
-				src="/logo-orange-on-white-2023-08-29.svg"
+				src={`${import.meta.env.BASE_URL}/logo-orange-on-white-2023-08-29.svg`}
 				alt="The Zach Fox Photography logo."
 			/>
 		</a>
