[Feature Request]use alova in sveltekit

[JOU-amjs]

I am trying to use alova with SvelteKit (not Svelte). The YouTube vid promoting it, as well as the website, indicates is support SSR, which would indicate it is possible to run server side with SvelteKit.

SvelteKit 1 uses directory based routing (similar to Next.JS), and any route would typically have at least 2 pages:

• /folder-route-name/+page.js (runs server side first, then client side afterwards)
• OR
• /folder-route-name/+page.server.js (if wanting to run server only, never in client, as perhaps secret API key involved which should not be exposed to client)
• /folder-route-name/+page.svelte (UI code, html, css, client side javascript)

A typical +page.js uses an extend web standard fetch (that runs in node.js too, i.e. server side first). Either +page.js file needs to "return data" object which is then accessible in the +page.svelte file.

Example:

// ------- +page.js ------------
let query = `
query homepage {
  homepageSliders: sliders {
    nodes {
      id
      title
      sliderData {
        image {
          id
          mediaItemUrl
        }
        buttonLabel
        buttonLink
      }
    }
  }
}
`;

export const load = async ({ fetch, event, setHeaders }) => {
	try {
		const response = await fetch(import.meta.env.VITE_GRAPHQL_URL, {
			method: 'POST',
			headers: { 'Content-Type': 'application/json' },
			body: JSON.stringify({ query })
		});
		setHeaders({
			'cache-control': `max-age=0, s-maxage=${60 * 60}`
		});
		const { data } = await response.json();
		return data;
	} catch (error) {
		console.error(`Error in load function for: ${error}`);
	}
};

...Note the 'data' from the API call must be returned. Then in +page.svelte, you'd have a script tag at the top that would make the data object available in the rest of the page, something like:

<!-- ---- +page.svelte ----- -->
<script>
export let data;
</script>

<pre>
My Homepage data: {JSON.stringify(data), null, 2}
</pre>

...basically anything in braces lets you access the data object or other javascript you've written in the script tags.

I followed your basic svelte example listed above, but can not figure out where to return the data. Each place I try it results in an error, which means the data from the API call is never available in the UI building file.

I take it you aren't familiar with SvelteKit, but perhaps I've given enough data that you might have an idea how to covert the code example referenced in your above link into a function the in the end will 'return data'?

Originally posted by @trulycool in #49 (comment)

[JOU-amjs]

🎉 This issue has been resolved in version 2.8.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[JOU-amjs]

Now alova is optimized in SSR. and docs is here.

This issue is refer this post.