i18n per componente

    Type-Safe. Traduci con l'IA. Modifica visivamente.

    Definisci le traduzioni accanto ai componenti per accelerare lo sviluppo. Mantieni il tuo bundle leggero come dovrebbe essere. Invita editor tramite il CMS. Ogni contributo è davvero apprezzato.

    npm install intlayer

    Disponibile per

    // src/component/server/component.content.tsimport { t, type Dictionary } from "intlayer";const componentContent = {  key: "server-component",  content: {    title: t({      en: "Title of my component",      fr: "Titre de mon component",      es: "Título de mi componente",    }),    content:      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",  },} satisfies Dictionary;export default componentContent;
    // src/components/Component.tsxexport const Component = () => {  return (    <div>      <h2>Intlayer Compiler</h2>      <p>        The Intlayer Compiler extracts automatically the content from the        components and generates the dictionary files.      </p>    </div>  );};
    Provalo gratuitamente usando il playground.Vai al playground
    intlayer test
    $ npx intlayer test
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    ~/Desktop/MyApp

    Migliora la manutenibilità del codice mantenendo le definizioni dei contenuti vicino ai componenti. Riduci la ridondanza, migliora la chiarezza e semplifica gli aggiornamenti con un approccio strutturato che rende il codice più facile da gestire e scalare nel tempo.

    Estrai il tuo contenuto istantaneamente con il Compilatore Intlayer. Genera automaticamente i file di dizionario necessari per il tuo contenuto per internazionalizzare la tua applicazione in un secondo.

    Sfrutta l’editor visivo gratuito per costruire e gestire il tuo sito con facilità. Crea, modifica e organizza componenti e pagine senza toccare il codice, facilitando la collaborazione tra gestori di contenuti e sviluppatori.

    Espandi la tua portata con il supporto di traduzione integrato. Traduci facilmente i tuoi contenuti utilizzando un’interfaccia intuitiva, garantendo esperienze multilingue fluide per i tuoi utenti senza la seccatura di gestire manualmente più versioni di contenuto.

    Usa la CLI di Intlayer per testare e riempire i tuoi contenuti con l’AI, assicurandoti che tutte le traduzioni siano complete e accurate.

    Perché scegliere Intlayer?

    Gratuito e Open Source

    Intlayer è gratuito e open source, permettendoti di usarlo gratuitamente e contribuire per adattarlo alle tue esigenze.

    Gestione dei contenuti potenziata da JavaScript

    Sfrutta la flessibilità di JavaScript per definire e gestire i tuoi contenuti in modo efficiente.

    Ambiente Type-Safe

    Sfrutta TypeScript per garantire che tutte le tue definizioni di contenuto siano precise e prive di errori.

    Dichiarazione a livello di componente

    Mantieni le tue traduzioni vicino ai rispettivi componenti, migliorando la manutenibilità e la chiarezza.

    Configurazione Semplificata

    Avvia rapidamente con configurazione minima, ottimizzata soprattutto per progetti Next.js.

    CMS Integrato

    Modifica i tuoi contenuti sul tuo sito web con un CMS integrato direttamente sul tuo sito. Aumenta la generazione di contenuti grazie all'IA.

    Tecnologia

    Caricamento JSON dinamico

    Carica le traduzioni in modalità lazy durante l'esecuzione

    JSON con ambito (namespacing)

    Spazi dei nomi di traduzione per pagina

    Benchmark delle prestazioni I18n

    Nessun dato disponibile

    Cos'è questa metrica?

    La dimensione totale compressa con gzip del bundle della libreria di internazionalizzazione. Include solo il provider e la logica di recupero dei contenuti dopo il tree-shaking e la minificazione.

    Perché è importante?

    Una dimensione della libreria più piccola riduce il payload JavaScript iniziale, portando a tempi di download ed esecuzione più rapidi sul client.

    Visualizza come

    Analizza il punteggio di localizzazione globale del tuo sito web

    Valuta rapidamente e gratuitamente la qualità della localizzazione del tuo sito. Analizza i principali elementi multilingue del tuo sito web per ottenere un punteggio completo e raccomandazioni pratiche per migliorare la tua portata.

    i18n basato sul codice

    Traduzioni type-safe che vivono nel tuo repository.

    Dichiara i contenuti accanto ai tuoi componenti in TypeScript o JavaScript. Intlayer genera automaticamente i tipi, offrendoti autocompletamento, validazione e feedback istantaneo. Basta chiavi mancanti o cambi di contesto.

    AI CLI Tool

    Automatizza le traduzioni dal tuo terminale.

    La CLI per controllare, riempire e tradurre JSON e Markdown con l'IA.

    Esegui `npx intlayer fill` per rilevare chiavi mancanti e generare traduzioni usando OpenAI, Claude o modelli locali. Mantieni pulita la cronologia Git e i tipi sicuri.

    Intlayer TMS

    Smetti di pagare per parola. Automatizza con l'IA.

    L'alternativa open-source a Crowdin e Lokalise. Costruita per flussi di lavoro moderni per sviluppatori.

    Gestisci le traduzioni direttamente nel tuo codice o tramite l'editor visivo. Sfrutta l'IA per tradurre istantaneamente. Collabora con il tuo team senza limiti di posti.

    CMS Headless

    Collega il tuo codice locale con contenuti remoti.

    Gestisci contenuti multilingue senza sovraccarico. Intlayer interconnette dizionari locali con gestione remota, abilitando Live Sync per aggiornamenti rapidi senza rebuild. Usa webhook per CI/CD e gestisci feature flags.

    Feature Flags

    Attiva le funzionalità istantaneamente. Nessun deploy richiesto.

    I dizionari Intlayer sono più che testo. Usali per dichiarare logica, stili e configurazioni. Con Live Sync, attiva o disattiva funzionalità, cambia temi UI e aggiorna il comportamento dell’app in tempo reale dal CMS.

    Test A/B

    Il tuo parco giochi per esperimenti di prodotto.

    Sii il primo a esplorare la nuova beta di A/B Testing guidato dall'IA di Intlayer, costruita per aumentare la scopribilità e guidare decisioni di prodotto più intelligenti. Testa qualsiasi cosa in tempo reale, dai copy e design alle funzionalità complete, e lascia che i dati ti mostrino cosa funziona davvero.

    Disponibile su

    Prova la demo dal vivo

    Costruito dalla comunità

    Incontra gli straordinari contributori che rendono possibile Intlayer

    Domande frequenti

    Cos’è l’internazionalizzazione (i18n)?

    L’internazionalizzazione (i18n) è il processo di progettazione e sviluppo di applicazioni come Next.js, React o Express per supportare facilmente più lingue. Ti consente di creare siti web multilingue semplificando il processo di traduzione. Strumenti come TypeScript rendono più facile implementare l’i18n, consentendo un’adattamento efficiente e semplice della tua applicazione a diverse lingue e regioni.Scopri di più sull’internazionalizzazione

    Quali sono le principali funzionalità di Intlayer?

    Intlayer semplifica la gestione delle configurazioni e abilita l’internazionalizzazione per vari tipi di applicazioni JavaScript, inclusi i componenti server. Consente la dichiarazione del contenuto direttamente accanto ai componenti, migliorando la manutenzione del codice. Inoltre, Intlayer sfrutta TypeScript per prevenire le dichiarazioni mancanti. Infine, Intlayer offre un editor visivo, che consente a chi non è sviluppatore di modificare i contenuti del sito web, tradurre automaticamente utilizzando l’intelligenza artificiale e ottimizzare il SEO dell’applicazione.Scopri di più sulle funzionalità di Intlayer

    Esiste un editor visivo in Intlayer?

    Sì, Intlayer offre un editor visivo opzionale per gestire i contenuti facilmente senza dover entrare nel codice.Scopri di più sull’editor visivo

    Qual è il costo di utilizzo di Intlayer?

    Intlayer integra una selezione di pacchetti NPM gratuiti insieme a un editor visivo. Inoltre, offre un CMS per l’esternalizzazione dei contenuti. Questo CMS è gratuito, ma include funzionalità aggiuntive per i membri dei piani Premium ed Enterprise.Scopri di più sui piani di Intlayer

    Posso integrare Intlayer sulle soluzioni esistenti?

    Sì, Intlayer può essere integrato come wrapper intorno a i18next, next-intl, vue-i18next e altro. Questo ti permette di automatizzare le tue traduzioni e usare Intlayer senza dover rifattorizzare il tuo codice esistente.

    Che cos’è Intlayer?

    Intlayer è un pacchetto che ti consente di gestire il tuo sito web multilingue. Fornisce un insieme di strumenti e utility che facilitano la configurazione del tuo sito web per contenuti multilingue e localizzazione.Scopri di più su Intlayer

    Come si integra Intlayer con Next.js?

    Intlayer si integra con Next.js per abilitare il rendering lato server e la generazione di siti statici, rendendo la consegna dei contenuti multilingue più efficiente.Scopri di più sull’integrazione con Next.js

    Come posso contribuire a Intlayer?

    Puoi contribuire inviando pull request o segnalando problemi nel repository di GitHub.Scopri di più su come contribuire

    Quali piattaforme supporta Intlayer?

    Intlayer è disponibile per React (compreso Create React App), Vite con React, Next.js, Tanstack Start, Vue, Nuxt, Express, NestJS, Preact e altro. Questo garantisce un’integrazione fluida con i moderni framework JavaScript e gli ambienti server-side.Scopri di più sulle piattaforme supportate
    Leggi tutte le domande frequenti