API de composant server-side

Modifier cette page sur Github

ts
const result = Component.render(...)

À la différence des composants client-side, les composants server-side n'ont pas d'existence après que vous les ayez rendus — leur seul et unique rôle est de créer du HTML et du CSS. Pour cette raison, leur API est un peu différente.

Un composant server-side expose une méthode render qui peut être appelée avec des props optionnelles. Cette méthode renvoie un objet avec des champs head, html et css, où head représente le contenu de tout élément <svelte:head> rencontré.

Vous pouvez importer un composant Svelte directement dans Node en utilisant svelte/register.

ts
require('svelte/register');

const App = require('./App.svelte').default;

const { head, html, css } = App.render({
	answer: 42
});

La méthode .render() accepte les paramètres suivants :

paramètre	défaut	description
props	{}	Un objet de props à fournir au composant
options	{}	Un objet d'options

L'objet options accepte les champs suivants :

option	défaut	description
context	new Map()	Une Map de paires clé-valeur de contexte à fournir au composant

ts
const { head, html, css } = App.render(
	// props
	{ answer: 42 },
	// options
	{
		context: new Map([['context-key', 'context-value']])
	}
);