Sourcing Data from JSON with Content Collection failing | Astro Lounge | Page 1

fleet marlin Feb 21, 2025, 10:24 PM

#

Still looking into this but just as a start each entry in your collection must have a unique ID when using the file loader

#

Does it work if you remove the debug stuff?

thorn kernel Feb 21, 2025, 10:26 PM

#

In that case, are you saying to take the bio strings, turn those into objects with arbitrary ID values, so something like:

...,
"bio": {
  "professional": {"id": 1, "text": "a string" },
  "personal": {"id": 2, "text": "another string" },
}

fleet marlin Feb 21, 2025, 10:26 PM

#

pretty much

thorn kernel Feb 21, 2025, 10:26 PM

#

let me see

fleet marlin Feb 21, 2025, 10:27 PM

#

or perhaps the ID key should be on "bio"

thorn kernel Feb 21, 2025, 10:27 PM

#

removing console log does not change error

fleet marlin Feb 21, 2025, 10:27 PM

#

i dont work with content collections much

#

so bio would have the ID and your schema would look like

  schema: z.object({
    id: z.string(),
    professional: z.string(),
    personal: z.string(),
  }),

thorn kernel Feb 21, 2025, 10:28 PM

#

https://docs.astro.build/en/guides/content-collections/#nested-json-documents

Docs

Content collections

Manage your content with type safety.

#

That's what I was referencing here for reference

fleet marlin Feb 21, 2025, 10:28 PM

#

Indeed, I have that open as well

thorn kernel Feb 21, 2025, 10:28 PM

#

fleet marlin so bio would have the ID and your schema would look like ``` schema: z.objec...

I'll be so grouchy if this works

fleet marlin Feb 21, 2025, 10:29 PM

#

The ID info can be found here https://docs.astro.build/en/guides/content-collections/#built-in-loaders

Perhaps we need to add clarification to the nested json section as well if this does help

thorn kernel Feb 21, 2025, 10:29 PM

#

That does not work

#

I used a num for ID

fleet marlin Feb 21, 2025, 10:29 PM

#

darn

thorn kernel Feb 21, 2025, 10:29 PM

#

but

#

it now says:

fleet marlin Feb 21, 2025, 10:29 PM

#

you need to use a string for it

thorn kernel Feb 21, 2025, 10:29 PM

#

bio → id data does not match collection schema.
Expected type "object", received "number"

fleet marlin Feb 21, 2025, 10:29 PM

#

hmm that's weird

thorn kernel Feb 21, 2025, 10:29 PM

#

also

fleet marlin Feb 21, 2025, 10:29 PM

#

do you have a repo I could look at?

thorn kernel Feb 21, 2025, 10:30 PM

#

I don't have this pushed, it's a private repo, and I'm not SUPER fluent with git

#

Let me see if I can get a minimal repro

#

That's something I need to get better at

fleet marlin Feb 21, 2025, 10:30 PM

#

Sure, much appreciated

I am much more of a "try things and see if it works" debugger
Not very good at talking others through my convuluted thought process 😅

thorn kernel Feb 21, 2025, 10:31 PM

#

That's all good. Are you an astro contributor/maintainer?

fleet marlin Feb 21, 2025, 10:32 PM

#

Just a helpful community member 🙂

(Though I have contributed a small amount to the docs)

thorn kernel Feb 21, 2025, 10:32 PM

#

❤️

#

I would love to contribute but I think I don't know enough about the lower-level details

fleet marlin Feb 21, 2025, 10:33 PM

#

You are actually earning contributor credit just by being active in the discord 🙂

One of the great things about the Astro team is they really recognize the power and benefits of having a strong welcoming community, and so just by being a part of that you will eventually recieve the contributor tag in discord automatically 😄

thorn kernel Feb 21, 2025, 10:40 PM

#

It seems making the data an array works

#

So it doesn't like:

  "bio": {
      "professional": "string",
      "personal": "another string"
    }

but it DOES like:

  "bio": [
    {
      "id": 1,
      "professional": "string",
      "personal": "another string."
    }
  ]

#

Which will work but it's sort of annoying (to me)

#

I guess it makes sense cause this isn't really a collection per se, I guess the word collection implies an array-like structure. The docs seem to suggest that you can source stuff from a plain old JSON object, but for some reason I can't seem to get it working.

fleet marlin Feb 21, 2025, 10:45 PM

#

Man what a good catch!

I didn't think of that because your work-experience is an array so I just assumed the latter was without really looking 😅

#

Yeah the collection would have to be an array of objects

thorn kernel Feb 21, 2025, 10:45 PM

#

Yeah i mean if I was making inferences I would think that being able to source data from an OBJECT would be a pretty standard use case

#

I was even getting an error message that says it needs either to be an array OR an object

#

From their docs:

The file() loader creates entries from a single file that contains an array of objects with a unique id field, or an object with string keys. It supports JSON or YAML, and you can provide a custom parser for data files it cannot parse by default.

#

https://docs.astro.build/en/reference/content-loader-reference/#file-loader

Docs

Astro Content Loader API

fleet marlin Feb 21, 2025, 10:47 PM

#

I think the idea is that if you just have a single object, why not just import that object vs using a collection, since a collection by it's nature needs to be multiple things

thorn kernel Feb 21, 2025, 10:48 PM

#

yeah good call, I saw some docs about Vite allowing you to directly import JSON objects

fleet marlin Feb 21, 2025, 10:48 PM

#

But that is interesting that you can use a top level object but not a nested object!

thorn kernel Feb 21, 2025, 10:48 PM

#

maybe that's a better thing to do in my use case

fleet marlin Feb 21, 2025, 10:56 PM

#

I went ahead and asked the docs team if we need to clarify that nested json needs to be structured in an array of objects on that particular page 🙂

thorn kernel Feb 21, 2025, 11:02 PM

#

Thank you - please @ me if you need more testing/info. I can probably make a repo if it would be helpful.

#

I might work on that right now real quick

thorn kernel Feb 21, 2025, 11:49 PM

#

I think this should represent a working (as in not working) example of the issue I'm facing:

#

https://github.com/anmpog/content-collection-issue-repro

GitHub

GitHub - anmpog/content-collection-issue-repro: Trying to illustrat...

Trying to illustrate an issue I'm having sourcing data from JSON in attempt to create a content collection. - anmpog/content-collection-issue-repro

fleet marlin Feb 23, 2025, 11:08 PM

#

@thorn kernel 👋

If you get a chance would you mind checking out Armands suggested reworks to the docs to clarify the file loader file structure?

Feel free to leave a comment 😄

https://github.com/withastro/docs/issues/11027#issuecomment-2676889444

GitHub

File Loader API unclear · Issue #11027 · withastro/docs

📚 Subject area/topic Content Loader API 📋 Page(s) affected (or suggested, for new content) https://docs.astro.build/en/reference/content-loader-reference/#file-loader 📋 Description of content that ...

thorn kernel Feb 23, 2025, 11:13 PM

#

Hey! I think that I agree with you, the first rewrite they suggested seems to be clear. What I found was that you can just import a JSON file directly into an Astro file and treat the import as an object. My only other thought is that this - to me at least - seems like a common enough use case that it might get more mention somewhere within the content collection documentation. It seems like there could almost be a section in the docs aimed at the various ways you can source data. For my use case it makes more sense to just import the JSON file directly and my confusion was around the idea that content collections are specifically for list-type data. I’m still relatively new to Astro though so I attribute this to my lack of experience. I’ve read certain parts of the docs pretty closely but by no means all parts.

#

I’ve been reading a bit more in the documentation and it’s definitely fair to say that this could just be an issue with how I interpreted the existing verbiage - don’t want to make too much work for anyone else

fleet marlin Feb 23, 2025, 11:17 PM

#

Feel free to drop a comment on the issue 😄

#Sourcing Data from JSON with Content Collection failing