Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Content collection does not recognize frontmatter with .JPG (uppercase) #12621

Closed
1 task
tordans opened this issue Dec 4, 2024 · 0 comments · Fixed by #12623
Closed
1 task

Content collection does not recognize frontmatter with .JPG (uppercase) #12621

tordans opened this issue Dec 4, 2024 · 0 comments · Fixed by #12623
Assignees
Labels
feat: content collections Related to the Content Collections feature (scope)

Comments

@tordans
Copy link
Contributor

tordans commented Dec 4, 2024

Astro Info

Astro                    v5.0.2
Node                     v22.9.0
System                   macOS (arm64)
Package Manager          npm
Output                   server
Adapter                  none
Integrations             keystatic
                         @astrojs/tailwind
                         @astrojs/react
                         @astrojs/mdx
                         @astrojs/sitemap

If this issue only occurs in one browser, which browser is a problem?

Chome

Describe the Bug

In Astro 4, we can have frontmatter to images like teaserImage: /src/assets/subprojects/schulexpress/teaserImage.JPG

In Astro 5, the images with uppercase .JPG are not transformed to an image object:

image

As a result, I am getting the missleading MissingImageDimension error.

MissingImageDimension
Missing image dimensions
Missing width attribute for /src/assets/subprojects/handlungsprogramm-flughafenumfeld/teaserImage.JPG. When using remote images, both dimensions are required in order to avoid CLS.


I am assuming this is due to some changes in the glob pattern which now do not look for JPG (uppercase) anymore.

I had a similar issue with https://docs.astro.build/en/recipes/dynamically-importing-images/ where it states to use const images = import.meta.glob<{ default: ImageMetadata }>('/src/assets/*.{jpeg,jpg,png,gif}'); however we have to use const images = import.meta.glob<{ default: ImageMetadata }>('/src/assets/**/*.{jpeg,jpg,png,gif,webp,JPG,JPEG,PNG,GIF}')

What's the expected result?

Uppercase file endings should work just like lowercase.
Or there should be a better error and warning.


About my Minimal Reproducible: I cannot get this to work because Stackblitz does not show any results and complains about Cannot find module 'astro:content' or its corresponding type declarations.(2307). But the basic setup is there.

Link to Minimal Reproducible Example

https://stackblitz.com/edit/github-e6sxdg?file=src%2Fcomponents%2FCollection.astro,content.config.ts&on=stackblitz

Participation

  • I am willing to submit a pull request for this issue.
@github-actions github-actions bot added the needs triage Issue needs to be triaged label Dec 4, 2024
@ascorbic ascorbic added feat: content collections Related to the Content Collections feature (scope) and removed needs triage Issue needs to be triaged labels Dec 4, 2024
@ascorbic ascorbic self-assigned this Dec 4, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
feat: content collections Related to the Content Collections feature (scope)
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants