Astro wird nicht ausgeführt, wenn der Fehler „Lokale Bilder müssen importiert werden“ auftritt und ich nicht finden kann ⇐ JavaScript

[Anonymous]

Ich erstelle einen Blog und füge derzeit Unterstützung für Miniaturansichten von Bildern zu meinen Blogbeiträgen hinzu, aber Astro sagt mir immer wieder: „Lokale Bilder müssen importiert werden.“ Jetzt werden die Miniaturbilder meiner Website für Beiträge überhaupt nicht mehr geladen.
Fehlerbild
Ich habe jeden Schritt in der Dokumentation durchgeführt:

Ein zugehöriges Bild für einen Inhaltssammlungseintrag deklariert.

Ich habe den Bildhilfs für das Inhaltssammlungsschema verwendet, mit dem Sie das Bild validieren und importieren können.
Und es wird mir immer wieder angezeigt Fehler:

Lokale Bilder müssen importiert werden.
Der src-Parameter von Image und getImage muss ein importiertes Bild oder eine URL sein, es darf kein String-Dateipfad sein. Empfangen ./images/chini.jpg.
Siehe Dokumentationsreferenz
Wenn Sie ein Bild aus Ihrem src-Ordner verwenden möchten, müssen Sie es entweder importieren oder, wenn das Bild aus einer Inhaltssammlung stammt, den Schemahelfer image() verwenden. Weitere Informationen zur src-Eigenschaft finden Sie unter https://docs.astro.build/en/guides/images/#src-required.

Ich habe die Schritte befolgt, da ich Bilder aus der Inhaltssammlung meines src-Ordners verwenden möchte, also habe ich den Schema-Helfer verwendet, wie Sie jetzt in meiner config.ts-Datei sehen werden:

Code: Select all

import { defineCollection, z } from "astro:content";

const postsCollection = defineCollection({
schema: ({ image }) => z.object({
author: z.string(),
date: z.string(),
image: image(),
title: z.string(),
}),
});

export const collection = {
posts: postsCollection,
};

Hier ist die MD-Datei für ein Beitragsbeispiel:

Code: Select all

author: andre-vitor
categories: ["first post"]
date: 10/01/2026
featured: false
image: "./images/chini.jpg"
title: Hello
---

oie esse é meu primeiro post de blog Muito Bacana e Supimpa
Eu não sei o atalho pra fazer lorem ipsum e enxer linguiça
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
KKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKKK

## Introdução

eu sou o dré haha

Hier ist die Post-Komponente:

Code: Select all

import { type CollectionEntry } from "astro:content";
import { Image } from "astro:assets";

type Props = {
post: CollectionEntry;
};

const { post } = Astro.props;
console.log(post.data.image)

[url={`/blog/${post.slug}`}]

[/url]
[url={`/blog/${post.slug}`}
class=]
{post.data.title}
[/url]

{post.body}

Laut Dokumentation sollte es einwandfrei laufen, aber ich versuche nicht, eine Lösung für den Fehler zu finden, der mir angezeigt wird.