Hızlı başlangıç

Svelte 5 gerektirir. SDK, SvelteKit sunucu taraflı işleme ile çalışır. GitHub'da kaynak

Proje oluşturun

Langsys'te bir proje oluşturun. Projenin kimliğine ve bir API anahtarına ihtiyacınız olacak. Erken erişim talep edin

Kurulum

npm install langsys-js-svelte

Başlatın

Langsys'i kök düzeninizde (root layout) yalnızca bir kez başlatın. Bir yapılandırma nesnesi ve kullanıcının yerel ayarını tutan yazılabilir bir store alır.

// src/routes/+layout.svelte
<script lang="ts">
    import { writable } from 'svelte/store';
    import { onMount } from 'svelte';
    import { LangsysApp, type iLangsysInitConfig } from 'langsys-js-svelte';

    const userLocale = writable('en-US');

    onMount(async () => {
        const config: iLangsysInitConfig = {
            projectid: import.meta.env.VITE_LANGSYS_PROJECT_ID,
            key: import.meta.env.VITE_LANGSYS_API_KEY,
            UserLocaleStore: userLocale,
            baseLocale: 'en-US',
            ssrTokenStrategy: 'client', // 'client' | 'server' | 'auto'
        };

        const res = await LangsysApp.init(config);
        if (!res.status) console.warn(res.errors?.join(', '));
    });
</script>

API anahtarları

Yazma anahtarı

Geliştirme için. SDK, uygulamanızda göründükçe yeni ifadeleri ve içerik bloklarını kaydeder.

Salt okunur anahtar

Canlı ortam için. SDK yalnızca çevirileri getirir, hiçbir zaman ifade oluşturmaz.

SDK, sahip olduğu anahtarın türünü algılar ve buna göre davranır.

İfadeleri çevirin

Tek tek metin dizeleri için t store'unu kullanın. İfadenin kendisi hem arama anahtarı hem de temel dildeki metindir; dolayısıyla ayrı bir anahtar dosyası yoktur. Süslü parantez içindeki yer tutucular, derleme sırasında tür denetiminden geçer.

<script lang="ts">
    import { t } from 'langsys-js-svelte';
</script>

<h1>{$t('Welcome to my app', 'UI')}</h1>
<p>{$t('Hello, {name}!', 'UI', { name: 'Sarah' })}</p>
<p>{$t('You have {count} new messages', 'Notifications', { count: 3 })}</p>

Aynı ifade farklı yerlerde farklı anlamlara geldiğinde bir kategori kullanın:

<strong>{$t('Home', 'Main menu')}</strong>
<strong>{$t('Home', 'Home repairs')}</strong>

İçerik bloklarını çevirin

Yapının önemli olduğu daha büyük bloklar için Translate bileşenini kullanın. Çevirmenler biçimlendirilmiş sonucu görür ve onu tek bir birim olarak çevirir; yine de içinde ifade ifade çalışmaya devam ederler.

<script lang="ts">
    import { Translate } from 'langsys-js-svelte';
</script>

<Translate category="Blog" tag="article">
    <h1>My article title</h1>
    <p>My content <strong>reads best</strong> in the reader's own language.</p>
</Translate>

Diğer SDK'lar ve API

React

npm install langsys-js-react

Vue

npm install langsys-js-vue

TypeScript (any framework)

npm install langsys-js-typescript

REST API

API referansı

Bir konuda takıldınız mı? Bize mesaj gönderin