"Invalid hook call" error when following the Astro guide

[stefanprobst]

i am following the steps from https://keystatic.com/docs/installation-astro and i am seeing an "Invalid hook call" react error. did anybody manage to make keystatic work with astro and could link to an example repo? thanks

EDIT: error message:

[etmartinkazoo]

Hi @stefanprobst - I have a few production projects with Keystatic and Astro. Here are a few gotchas I had to overcome:

1. I needed to use Node 16 --LTS
2. You need to use <Keystatic client:only="react" /> in the [...params].astro file. In particular you cannot just use client:only. You'll need to use client:only="react" to hint usage of React if you are using it in conjuction with another front end framework/library.
3. Start with:

storage: {
  kind: "local",
},

before going on to a GitHub integration.

Hope that helps!

[stefanprobst]

thanks! - switching to node v16 did indeed help!

[simonswiss]

Hey @stefanprobst — do you have a repo I can take a look at?

Not sure if you've followed the "new" guide or now, but I've updated the Astro guide less than a day ago with some details about the new hybrid rendering mode in Astro, and how to use Astro's content collections with Keystatic.

We're also working on an Astro template for the Keystatic CLI, that we can hopefully release soon ✨

[stefanprobst]

@simonswiss these are the steps i followed (right before adding the api route): https://github.com/stefanprobst/issue-keystatic-astro/commits/main - on http://localhost:3000/keystatic i am seeing the "Invalid hook call" error

[stefanprobst]

interestingly, it seems to work with node v16.20.1 but not with v18.16.1.