

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

# Déployer une SvelteKit application sur Amplify Hosting
<a name="get-started-sveltekit"></a>

Suivez les instructions suivantes pour déployer une SvelteKit application sur Amplify Hosting. Vous pouvez utiliser votre propre application ou créer une application de démarrage. Pour plus d'informations, consultez [la section Création d'un projet](https://kit.svelte.dev/docs/creating-a-project) dans la *SvelteKit documentation*.

Pour déployer une SvelteKit application avec SSR sur Amplify Hosting, vous devez ajouter un adaptateur à votre projet. Nous ne maintenons pas d'adaptateur appartenant à Amplify pour le SvelteKit framework. Dans cet exemple, nous utilisons le `amplify-adapter` créé par un membre de la communauté. L'adaptateur est disponible sur [github. com/gzimbron/amplify-adaptateur](https://github.com/gzimbron/amplify-adapter) sur le GitHub site Web. AWS ne gère pas cet adaptateur.

**Pour déployer une SvelteKit application sur Amplify Hosting**

1. Sur votre ordinateur local, accédez à l' SvelteKit application à déployer.

1. Pour installer l'adaptateur, ouvrez une fenêtre de terminal et exécutez la commande suivante. Cet exemple utilise l'adaptateur communautaire disponible sur [github. com/gzimbron/amplify-adaptateur.](https://github.com/gzimbron/amplify-adapter) Si vous utilisez un autre adaptateur communautaire, remplacez-le {{amplify-adapter}} par le nom de votre adaptateur.

   ```
   npm install {{amplify-adapter}}
   ```

1. Dans le dossier du projet de votre SvelteKit application, ouvrez le `svelte.config.js` fichier. Modifiez le fichier pour utiliser `amplify-adapter` ou remplacez-le {{'amplify-adapter'}} par le nom de votre adaptateur. Le fichier doit ressembler à ce qui suit.

   ```
   import adapter from {{'amplify-adapter'}};
   import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';
   
                 
   /** @type {import('@sveltejs/kit').Config} */
   const config = {
           // Consult https://kit.svelte.dev/docs/integrations#preprocessors
           // for more information about preprocessors
           preprocess: vitePreprocess(),
   
           kit: {
                   // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
                   // If your environment is not supported, or you settled on a specific environment, switch out the adapter.
                   // See https://kit.svelte.dev/docs/adapters for more information about adapters.
                   adapter: adapter()
           }
   };
   
   export default config;
   ```

1. Validez la modification et transférez l'application vers votre dépôt Git.

1. Vous êtes maintenant prêt à déployer votre SvelteKit application sur Amplify.

   Connectez-vous à la console [Amplify AWS Management Console](https://console.aws.amazon.com/amplify/) et ouvrez-la.

1. Sur la page **Toutes les applications**, choisissez **Créer une nouvelle application**.

1. **Sur la page **Commencer à créer avec Amplify**, choisissez votre fournisseur de dépôt Git, puis choisissez Next.**

1. Sur la page **Ajouter une branche de référentiel**, procédez comme suit :

   1. Sélectionnez le nom du référentiel à connecter.

   1. Sélectionnez le nom de la branche du référentiel à connecter.

   1. Choisissez **Suivant**.

1. Sur la page des **paramètres de l'application**, recherchez la section **Paramètres de création**. Pour **Construire le répertoire de sortie**, entrez**build**.

1. Vous devez également mettre à jour les commandes de génération du frontend de l'application dans la spécification de construction. Pour ouvrir la spécification de construction, choisissez **Modifier le fichier YML**.

1. Dans le `amplify.yml` fichier, recherchez la section des commandes de construction du frontend. Entrez **- cd build/compute/default/** et**- npm i --production**.

   Votre fichier de paramètres de compilation doit ressembler à ce qui suit.

   ```
   version: 1
   frontend:
       phases:
           preBuild:
               commands:
                   - 'npm ci --cache .npm --prefer-offline'
           build:
               commands:
                   - 'npm run build'
                   - 'cd build/compute/default/'
                   - 'npm i --production'
                 
       artifacts:
           baseDirectory: build
           files:
               - '**/*'
       cache:
           paths:
               - '.npm/**/*'
   ```

1. Choisissez **Enregistrer**.

1. Si vous souhaitez qu'Amplify soit en mesure de fournir des journaux d'applications à Amazon CloudWatch Logs, vous devez l'activer explicitement dans la console. Ouvrez la section **Paramètres avancés**, puis choisissez **Activer les journaux d'applications SSR** dans la section Déploiement du **rendu côté serveur (SSR**).

1. Choisissez **Suivant**.

1. Sur la page **Révision**, choisissez **Enregistrer et déployer**.