diff --git a/content.config.ts b/content.config.ts index 8d9ceea..eb95476 100644 --- a/content.config.ts +++ b/content.config.ts @@ -16,4 +16,4 @@ export default defineContentConfig({ }) }) } -}) +}); diff --git a/src/components/content/prose-img.vue b/src/components/content/prose-img.vue index d0787cf..5e28204 100644 --- a/src/components/content/prose-img.vue +++ b/src/components/content/prose-img.vue @@ -8,8 +8,7 @@ </template> <script setup lang="ts"> -import { withTrailingSlash, withLeadingSlash, joinURL } from "ufo" -import { useRuntimeConfig, computed } from "#imports" +import { computed } from "#imports" import ImageComponent from "#build/mdc-image-component.mjs" @@ -43,17 +42,11 @@ const props = defineProps({ type: String, default: "lazy" // eager, lazy }, -}) +}); const refinedSrc = computed(() => { - if (props.src?.startsWith("/") && !props.src.startsWith("//")) { - const _base = withLeadingSlash(withTrailingSlash(useRuntimeConfig().app.baseURL)) - if (_base !== "/" && !props.src.startsWith(_base)) { - return joinURL(_base, props.src) - } - } - return props.src -}) + return getPublicPath(props.src); +}); </script> <!-- diff --git a/src/pages/articles/index.vue b/src/pages/articles/index.vue index c32c7fa..ce631ec 100644 --- a/src/pages/articles/index.vue +++ b/src/pages/articles/index.vue @@ -5,7 +5,7 @@ <div class="row pt-5" v-for="article in articles" :key="article.path"> <div class="col-5 col-lg-4 col-xl-3"> <NuxtLink v-if="article.img" :to="article.path"> - <img class="img-fluid" :src="article.img as string" :alt="article.title" loading="lazy" :title="article.title"> + <img class="img-fluid" :src="getPublicPath(article.img)" :alt="article.title" loading="lazy" :title="article.title"> </NuxtLink> </div> <div class="col-7 col-lg-8 col-xl-9"> @@ -41,7 +41,7 @@ a h4:hover { </style> <script setup lang="ts"> -import { useAsyncData, queryCollection } from "#imports"; +import { useAsyncData, queryCollection } from "#imports" -const { data: articles } = await useAsyncData("articles", () => queryCollection("content").order("date", "DESC").all()) +const { data: articles } = await useAsyncData("articles", () => queryCollection("content").order("date", "DESC").all()); </script> diff --git a/src/utils/index.ts b/src/utils/index.ts index f793ce5..69dad12 100644 --- a/src/utils/index.ts +++ b/src/utils/index.ts @@ -1 +1,16 @@ +import { withTrailingSlash, withLeadingSlash, joinURL } from "ufo" +import { useRuntimeConfig } from "#imports" + export const isDev = process.env.NODE_ENV === "development"; + +export const getPublicPath = function (path: string): string { + if (path?.startsWith("/") && !path.startsWith("//")) { + const _base = withLeadingSlash(withTrailingSlash(useRuntimeConfig().app.baseURL)); + if (_base !== "/" && !path.startsWith(_base)) { + return joinURL(_base, path); + } + } + return path; +} + +// datetime format