

Terjemahan disediakan oleh mesin penerjemah. Jika konten terjemahan yang diberikan bertentangan dengan versi bahasa Inggris aslinya, utamakan versi bahasa Inggris.

# Menerapkan SvelteKit aplikasi untuk Amplify Hosting
<a name="get-started-sveltekit"></a>

Gunakan petunjuk berikut untuk menyebarkan SvelteKit aplikasi ke Amplify Hosting. Anda dapat menggunakan aplikasi Anda sendiri, atau membuat aplikasi pemula. Untuk informasi selengkapnya, lihat [Membuat proyek](https://kit.svelte.dev/docs/creating-a-project) dalam *SvelteKit dokumentasi*.

Untuk menerapkan SvelteKit aplikasi dengan SSR ke Amplify Hosting, Anda harus menambahkan adaptor ke proyek Anda. Kami tidak memelihara adaptor yang dimiliki Amplify untuk kerangka kerja. SvelteKit Dalam contoh ini, kami menggunakan yang `amplify-adapter` dibuat oleh anggota komunitas. Adaptor tersedia di [github. com/gzimbron/amplify-adaptor](https://github.com/gzimbron/amplify-adapter) di GitHub situs web. AWS tidak mempertahankan adaptor ini.

**Untuk menerapkan SvelteKit aplikasi ke Amplify Hosting**

1. Di komputer lokal Anda, navigasikan ke SvelteKit aplikasi untuk menyebarkan.

1. Untuk menginstal adaptor, buka jendela terminal dan jalankan perintah berikut. Contoh ini menggunakan adaptor komunitas yang tersedia di [github. com/gzimbron/amplify-adaptor](https://github.com/gzimbron/amplify-adapter). Jika Anda menggunakan adaptor komunitas yang berbeda, ganti {{amplify-adapter}} dengan nama adaptor Anda.

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

1. Di folder project untuk SvelteKit aplikasi Anda, buka `svelte.config.js` file. Edit file untuk menggunakan `amplify-adapter` atau mengganti {{'amplify-adapter'}} dengan nama adaptor Anda. File akan terlihat seperti berikut.

   ```
   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. Komit perubahan dan dorong aplikasi ke repositori Git Anda.

1. Sekarang Anda siap untuk menerapkan SvelteKit aplikasi Anda ke Amplify.

   Masuk ke Konsol Manajemen AWS dan buka konsol [Amplify](https://console.aws.amazon.com/amplify/).

1. Pada halaman **Semua aplikasi**, pilih **Buat aplikasi baru**.

1. **Pada halaman **Mulai membangun dengan Amplify**, pilih penyedia repositori Git Anda, lalu pilih Berikutnya.**

1. Di halaman **Tambahkan cabang repositori**, lakukan langkah berikut:

   1. Pilih nama repositori untuk terhubung.

   1. Pilih nama cabang repositori untuk terhubung.

   1. Pilih **Berikutnya**.

1. Di halaman **Pengaturan aplikasi**, cari bagian **Pengaturan build**. Untuk **direktori keluaran Build**, masukkan**build**.

1. Anda juga harus memperbarui perintah build frontend aplikasi dalam spesifikasi build. Untuk membuka spesifikasi build, pilih **Edit file YHTML**.

1. Dalam `amplify.yml` file, cari bagian perintah build frontend. Masuk **- cd build/compute/default/** dan**- npm i --production**.

   File pengaturan build Anda akan terlihat seperti berikut ini.

   ```
   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. Pilih **Simpan**.

1. Jika Anda ingin Amplify dapat mengirimkan log aplikasi ke Amazon CloudWatch Logs, Anda harus mengaktifkannya secara eksplisit di konsol. Buka bagian **Pengaturan lanjutan**, lalu pilih **Aktifkan log aplikasi SSR** di bagian penyebaran **Server-Side Rendering (**SSR).

1. Pilih **Berikutnya**.

1. Di halaman **Tinjauan**, pilih **Simpan dan deploy**.