Merge pull request #61 from ynufes-tech/fix-image-basepath

Aboutページ画像パスの問題修正
ynufes-tech · Mar 4, 2024 · 422dd71 · 422dd71
2 parents 1e6d103 + 9f11497
commit 422dd71
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 11 deletions.
diff --git a/components/TheCarousel.vue b/components/TheCarousel.vue
@@ -25,7 +25,7 @@ const props = withDefaults(defineProps<Props>(), {
     :navigation="true"
     class="the-carousel"
   >
-    <swiper-slide v-for="image in imageList" :key="image"
+    <swiper-slide v-for="image in props.imageList" :key="image"
       ><img :src="image" class="swiper-image"
     /></swiper-slide>
   </swiper>

diff --git a/nuxt.config.ts b/nuxt.config.ts
@@ -5,6 +5,7 @@ export default defineNuxtConfig({
     public: {
       google_analytics_id: process.env.GOOGLE_ANALYTICS_ID,
       production_mode: process.env.PRODUCTION_MODE,
+      base_url: process.env.BASE_URL,
     },
     microCMSServiceDomain: process.env.MICROCMS_SERVICE_DOMAIN,
     microCMSApiKey: process.env.MICROCMS_API_KEY,

diff --git a/pages/about/index.vue b/pages/about/index.vue
@@ -1,15 +1,17 @@
 <script lang="ts" setup>
+const conf = useRuntimeConfig();
+const basePath = conf.public.base_url;
 const imageList = [
-  "/images/22-seiryo-images/about1.webp",
-  "/images/22-seiryo-images/about2.webp",
-  "/images/22-seiryo-images/about3.webp",
-  "/images/22-seiryo-images/about4.webp",
-  "/images/22-seiryo-images/about5.webp",
-  "/images/22-seiryo-images/about6.webp",
-  "/images/22-seiryo-images/about7.webp",
-  "/images/22-seiryo-images/about8.webp",
-  "/images/22-seiryo-images/about9.webp",
-];
+  "images/22-seiryo-images/about1.webp",
+  "images/22-seiryo-images/about2.webp",
+  "images/22-seiryo-images/about3.webp",
+  "images/22-seiryo-images/about4.webp",
+  "images/22-seiryo-images/about5.webp",
+  "images/22-seiryo-images/about6.webp",
+  "images/22-seiryo-images/about7.webp",
+  "images/22-seiryo-images/about8.webp",
+  "images/22-seiryo-images/about9.webp",
+].map((path) => basePath + path);
 useHead({
   title: "清陵祭 - 清陵祭について",
   meta: [