feat: use relative paths for cover images

This commit is contained in:
saicaca
2023-12-28 14:37:18 +08:00
parent 197d524b53
commit 3fcb566a54
4 changed files with 17 additions and 5 deletions

View File

@@ -1,4 +1,5 @@
---
import path from "path";
import PostMetadata from "./PostMetadata.astro";
interface Props {
class: string;
@@ -22,6 +23,7 @@ import { Icon } from 'astro-icon/components';
import Button from "./control/Button.astro";
import {i18n} from "../i18n/translation";
import I18nKey from "../i18n/i18nKey";
import {getDir} from "../utils/url-utils";
const hasCover = image !== undefined && image !== null && image !== '';
@@ -69,7 +71,7 @@ const { remarkPluginFrontmatter } = await entry.render();
class="transition opacity-0 group-hover:opacity-100 text-white text-5xl">
</Icon>
</div>
<ImageBox src={image} alt="Cover Image of the Post"
<ImageBox src={image} basePath={path.join("content/posts/", getDir(entry.id))} alt="Cover Image of the Post"
class="w-full h-full">
</ImageBox>
</a>}

View File

@@ -5,10 +5,11 @@ interface Props {
src: string;
class?: string;
alt?: string
basePath?: string
}
import { Image } from 'astro:assets';
const {id, src, alt} = Astro.props;
const {id, src, alt, basePath = '/'} = Astro.props;
const className = Astro.props.class;
const isLocal = !(src.startsWith('/') || src.startsWith('http') || src.startsWith('https') || src.startsWith('data:'));
@@ -18,7 +19,7 @@ const isLocal = !(src.startsWith('/') || src.startsWith('http') || src.startsWit
let img;
if (isLocal) {
const files = import.meta.glob<ImageMetadata>("../../**", { import: 'default' });
let normalizedPath = "../../" + path.normalize(src).replace(/\\/g, "/");
let normalizedPath = path.normalize(path.join("../../", basePath, src)).replace(/\\/g, "/");
img = await (files[normalizedPath])();
}