آیا این روش برای اصلاح یک خطای تایپی بین تایپاسکریپت و API تحویل محتوا در Contentful ایمن است؟


من از Astro و Contentful برای ساخت یک بلاگ استفاده میکنم. من یک نوع محتوا به نام author دارم که ۳ فیلد دارد.

نامنوع فیلد
نام کاملمتن کوتاه
شلیک به سررسانه
بیومتن غنی

من در حال کار بر روی ایجاد یک مؤلفه هستم که تمامی نویسندگان را فهرست کند. کد من به شرح زیر است:

---
import { contentfulClient } from "../lib/contentful";
import { documentToHtmlString } from "@contentful/rich-text-html-renderer";
import type { Asset, EntryFieldTypes } from "contentful";


interface Author {
    contentTypeId: "author",
    fields: {
        fullName: EntryFieldTypes.Text,
        headshot: EntryFieldTypes.AssetLink,
        bio: EntryFieldTypes.RichText
    }
}

const authors = await contentfulClient.getEntries<Author>({
    content_type: "author"
})

---
<h1>Authors</h1>
{
    authors.items.map((author) => (
        <p>{author.fields.fullName}</p>
        <img src={`https:${(author.fields.headshot as any).fields.file.url}`} alt="" srcset="">
    ))
}

این کار میکند اما من مجبور شدم author.fields.headshot را به any تبدیل کنم چون تایپاسکریپت شکایت میکرد که fields یک خصوصیت از headshot نیست. و اینتلیسنس من فقط توانست sys را به عنوان یک خصوصیت از headshot پیدا کند.

پس این:

<img src={`https:${author.fields.headshot.fields.file.url}`} class="w-full max-w-48" alt="" srcset="">

به صورت محلی کار میکند. اما وقتی میخواهم آن را در Netlify مستقر کنم، ساخت شکست میخورد چون تایپاسکریپت کامپایل نمیشود. راهحل من کار میکند اما احساس خطرناک بودن دارد. فکر کردم شاید دارم از ویژگی EntryFieldTypes نادرست در رابط Author استفاده میکنم اما به نظر میرسد AssetLink مناسبترین گزینه باشد.

پاسخ شماره ۱

تعاریف TypeScript محتوا واقعاً چیز قابل توجهی هستند. به شدت بوی آن میدهد که بعد از واقعیت مجبور شدهاند آنها را به یک کتابخانه جاوااسکریپت پویا اضافه کنند.

من نگاهی به آموزش آنها انداختم که به EntryFieldTypes.Asset اشاره میکند، که وجود ندارد. اما نزدیکترین چیزی که پیدا کردم این است:

import { type Asset, type EntryFieldTypes } from 'contentful'

const headshot: Asset;

(author.fields.headshot as Asset).fields.file?.url

توجه داشته باشید که as Asset هنوز لازم است، زیرا به دلایلی نوع Entry نوع فیلد headshot را به never تنظیم میکند. (متغیر author از نوع Author نیست بلکه از نوع Entry<Author, undefined, string> است.)

در نهایت، شما میتوانید تلاش کنید تا نوعها را به صورت خودکار تولید کنید.

پاسخ شماره ۲

من فکر میکنم فیلد عکس پرتره شما باید از نوع Asset باشد نه AssetLink که لینکی در داخل ساختار متن غنی است.

headshot: Asset,