Consuming stores from client script.

[tough root]

<@&1095491216776380548> can I consume nano stores or svelte stores from a client script ?

[brazen copper]

Hi @tough root. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

---

Yes, you can consume Nano Stores or Svelte Stores from a client-side script. However, there are certain restrictions when using Nano Stores with Astro.

• Writing to a store from a .astro file or non-hydrated component will not affect the value received by client-side components.
• You cannot pass a Nano Store as a “prop” to client-side components.
• You cannot subscribe to store changes from a .astro file, since Astro components do not re-render.

If you understand these restrictions and still find a use case, you can give Nano Stores a try. Nano Stores are built for reactivity to changes on the client specifically.

Nano Stores and Svelte stores are very similar. In fact, nanostores allow you to use the same $ shortcut for subscriptions that you might use with Svelte stores. If you want to avoid third-party libraries, Svelte stores are a great cross-island communication tool on their own.

To get started with Nano Stores, you can install them alongside their helper package for your favorite UI framework. For example, for Svelte, you can install it using npm install nanostores.

For more details, you can refer to the Astro documentation on sharing state (https://docs.astro.build/en/core-concepts/sharing-state) and the Nano Stores usage guide (https://github.com/nanostores/nanostores#guide).

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: